Как просто использовать SVG иконки, что бы можно было менять их цвет с помощью CSS?

Question

[Pavel_Proca]

К примеру, есть папка с иконками в формате название.svg. Как добавить их в HTML документ, что бы при этом можно было менять их цвет с помощью CSS? Я пробовал добавлять их как обычную картинку, с помощью , но:
1 цвет иконок не получается менять никакими известными мне методами
2 я считаю, что так не правильно
Помогите, пожалуйста. Гуглил, но так и не нашёл толковую статью которая бы объясняла как это сделать легко и просто.

Можно ли их как-то добавить как шрифт, что бы можно было задавать и font-size?

Answer 1

[Петр]

1. Встраиваете svg в страницу.
2. Для его элементов не должен быть прописан цвет через атрибуты.

Answer 2

[Алексей]

Inkscape для создания шрифтов. Или поискать онлайн сервис можно. А так блокнотом откройте и в HTML скопируйте то что между тегами svg. Тогда в CSS можно будет менять свойство fill у данного объекта.

Answer 3

[Archakov Dennis]

Используйте SVG спрайты.