You can layer gradients at different angles and then use css blend modes on the element:after:

https://codepen.io/baggsie/pen/MvEgqz

For balance I run a Hack' (for the last 5 years) and have never had any issues whatsoever. Can't say the same for my MBA....

I usually use http://imakewebthings.com/waypoints/ .

Maybe their using: font-family: sans-serif;to

If so it would default to San Francisco/ Helvetica, Arial, whatever ubuntu uses depending on the OS.

I just use https://github.com/jkphl/gulp-svg-sprite to strip out all the fluff.

I have found that AI outputs much cleaner SVG than Sketch / Affinity though.

With Illustrator you can just select>copy the vector and paste into a text editor.

Are you offering a free / reduced upgrade path? I was actually thinking about purchasing v1this week but would prefer not to have to pay more in a month.

Vim - forced myself to learn the commands and have completely eliminated my RSI.

The alt tag is intended for "img" and "input", and not "i" (as is used by most icons systems). The benefit of using SVG is the 'desc' element that can be parsed by a screen reader.

Secondly dyslexic users may override all site fonts in favour of one designed for dyslexic users and so icons font will not render.

With regards to his points on accessibility, his points are true if you're only using icons as ornaments (such as he is in the header). If you're using icons as symbols then accessibility does matter -- a 'save' icon is perfectly fine for visual users whilst 'content: "\e600";' is useless for screen reader users.