Interactive Typography cheatsheet
DRANK

Monday, February 18th, 2019 at 2:31 pmA few weeks ago I stumbled across a great resource, a typography cheat sheet explaining the proper names of all the different parts of letters. I thought it would be fun to turn this into an interactive cheat sheet and wondered how much would be involved. Turns out, it wasn’t that much, so here is an interactive typography cheat sheet for you.The code is available on GitHub and I’d love to see contributions and improvement requests.One quick note on quality and resources:I was impressed how easy this was to do as the resource provided by the original creator Martin Silvertant was not only a PDF or JPG, but a cleanly organized AI file. My partner helped me to save it as an SVG and I was off to the races. The exported SVG was big, but it was easy to spot which parts aren’t needed. All I did was to use browser developer tools to see what is what by clicking the paths in the SVG in the source view and seeing them highlighted in the rendered SVG. I …

christianheilmann.com
Related Topics: SVG JavaScript GitHub