Can you change the color of svg icons to the global color I choose from Wordpress

Question

For example If I make svg icons that are grey and violet, when I change the global color scheme on wordpress, Is it possible to make it work so if the main color scheme was violet, and I change the global color from violet to yellow, the icons become grey and yellow, Is such thing possible?

Will SVG´s had to be in the HTML (php wordpress template) page for this or this can be CSS? Thanks

Answer 1

Yes, you can alter the colour of svg paths using css, BUT (and it's a big but, I cannot lie), only if the svg code is printed inline and not linked via an <img /> element.

For example (and this is just a line of css from one of my sites):

.logo g path { fill: #fff; }

Both g and path are svg elements, which is why you might not recognise them, and fill is the svg equivalent of background-color.