Figma plugins
Icon and Type Foundry: icon fonts and typefaces from Figma
Icon Foundry and Type Foundry are two Figma plugins that turn drawings into fonts. Icon Foundry exports a set of icons from Figma and builds a complete icon font, ready to use in code. Type Foundry turns letters drawn in Figma into a typeface you can install, entirely offline.
What problem do they solve?
Icons are one of the most duplicated things in any business. I've audited companies with 50 or 60 versions of the same icon, each drawn by a different team, which I've written about in what should go into a design system. Part of the reason is that getting icons from a designer's Figma file into a developer's code is fiddly, so people take shortcuts.
Custom type has a similar problem. Designers can draw letters in Figma, but turning those into a working font normally means specialist software and a lot of patience.
What does Icon Foundry do?
You select your icons in Figma and Icon Foundry builds the whole package:
- The icon font in WOFF2, WOFF and TTF formats
- The CSS to use it
- A list of code points
- A searchable preview page, so anyone can find the icon they need
The preview matters. If developers can't find an icon quickly, they'll draw their own, and you're back to 60 versions of the same thing.
Get Icon Foundry on the Figma Community.
What does Type Foundry do?
Type Foundry is forked from Icon Foundry. You draw your letters in Figma, and it turns them into a typeface you can install on your computer. It runs entirely offline, so nothing leaves your machine.
It's useful for brand projects, display type, and the kind of hand-drawn lettering that would otherwise end up as a flat image nobody can edit.
Sorting out your icons and type
At Designed for Humans I run design system audits that find duplicated icons, components and styles, and turn them into one shared library. Design Systems for Humans includes an icon library and keeps it in sync between Figma and code. You can try it free.
Got 60 versions of the same icon? Let's talk.