undefined | Better HN

0 pointsaccount424y ago0 comments

Not advocating for font icons but one advantage is that their color can be styled form the page CSS - for SVG that only works if the SVG is embedded in the HTML, not if it is loaded externally or from data URLs.

0 comments

1 comments · 1 top-level

runarberg4y ago

You can use SVG sprites to overcome that limitation. My SVG icons are usually only:

    <svg><use href="/path/to/sprite.svg#my-icon" /></svg>

Good SVG icons are a single <path> which can be colored in your CSS with

    svg { fill: currentColor; }

Then it will take which ever font color it inherits.

Off course I usually wrap this in a component and only write <app-icon icon="my-icon"></app-icon>.

j / k navigate · click thread line to collapse