Как сделать ховер на иконки?

Question

[olya095]

есть иконка цвета #808080
при ховере она становится #0066CC
нужно вставлять её в разметку?
или можно через стили как-то сделать ховер?

Comments

[Ankhena]

Если она инлайном, то менять fill.

Если картинкой или фоном, то фильтрами.
Если фоном, то фильтрами или масками.

https://codepen.io/noahblon/post/coloring-svgs-in-...

Answer 1

[andand44]

Вставлять в разметку не нужно. Нужно стилями менять цвет. Тогда можно и transition для плавности использовать. Если это иконка в svg или иконочный шрифт, само собой.

Answer 2

[Алексей Уколов]

Ховер должен срабатывать на каком-то элементе. Через стили можно "создать" псевдоэлемент и поместить в него иконку, если она сделана шрифтом или через svg.
Дальнейшее обсуждение можно вести только имея пример кода перед глазами.