We all know the feeling: just as you feel like you've finally achieved mastery of some great web technique… it's time to switch to something new and better.
SVG further enhances what we have seen regarding icon fonts. Chris Coyer wrote an interesting article about Icon Fonts VS SVG features, so I'm going to be very concise about these topics:
SVG icons can be implemented in many ways (I have covered many techniques in my previous SVG icons article), all them can be useful, but I think that the better solution is represented by the SVG symbols technique.
See the Pen SVG example by Massimo Cassandro (@massimo-cassandro) on CodePen.
At the moment only Firefox seems to let you edit symbol parts via CSS. Viewing the previous pen using FF, the third row should appears just like the last one, which uses inline SVG.