Как сделать плавную смену картинки слева-направо при hover?

Question

[EugeneNB]

Приветствую!
Хочу сделать плавную смену логотипа при наведении.
Есть 2 изображения лого, тёмное и цветное.

<a href="#" class="logo">
    <img src="/logo-dark.svg" alt="" class="logo-dark">
    <img src="/logo-color.svg" alt="" class="logo-color">
</a>

Можно ли сделать эффект разукрашивания, чтобы слева-направо лого менялось на цветное?

Comments

[Ankhena]

Две картинки это очень много
https://jsfiddle.net/kme24c73/
Не кроссбраузерно

Достаточно кроссбраузерно https://jsfiddle.net/namx6pb9/

Answer 1

[Максим]

Можно просто сменить цвет заливки при наведении ...
SVG как раз даёт такую возможность