
It doesn’t really matter, it was one of the first in the search results. I forgot what online converter I used for step 5. This did require some repetitive copy and pasting every time I made changes to some glyphs, but importing multiple SVG files to Birdfont was more annoying. I could have edited the glyphs in the font editor directly, but I found Illustrator’s bezier tools much easier to use. Convert the TTF file to WOFF and WOFF2 with some online converter.Copy and paste the vector shapes to the font editor, Birdfont.Outline glyphs from existing fonts in Illustrator.Processĭespite its UI, Birdfont got the job done anyway! And it didn’t take me long: about 2–3 hours, including figuring out everything in this post. So next time I’ll try FontForge, which looks ugly, but it’s open source, which makes it more attractive to create an open source font. The tools confused me, with tooltips inconsistently showing. With many common options tucked away in a single hamburger menu, I don’t find it has a good UI.
#Illustrator birdfont install
I ended up using Birdfont, because it seemed to be easier to install and setup.
#Illustrator birdfont free
Instead, I looked at two free alternatives: Birdfont and FontForge.
#Illustrator birdfont software
Turns out, it’s easy to make custom font files! Big Timer is an unpaid side project, so I didn’t want to spend a lot of money for the best software (probably $ 459 for FontLab). It’s easier for developers and the applications they build to combine a string of glyphs from a custom font than to align images.With real text, the application is accessible to screen readers, browser’s reader modes, search engines and whatnot.Of course you can always use images of glyphs instead of creating custom fonts, but fonts have benefits: I can see how it could be useful or nice to have a word mark as an accessible phrase on a website rather than as an image. I’ve heard IBM has a font with the striped I, B and M (I wonder if it has more glyphs!). Logos, or to be precise, wordmarks don’t need to be images. No need to even create custom fonts yourself! In fact, the example above is not image, but done just that way. So subsetting fonts gives us more typographic options! The Google Fonts API supports that: you can load a subset of a Google Font with just the glyphs you need by appending &text=theglyphsyouneed to your query. Loading that whole typeface could make the page noticeably slower, but loading only those 5 glyphs doesn’t make a big difference. But does it have to be that way? Let’s say you’d like put the word Autumn in some special font on your homepage for the end-of-season sale. So every time a designers asks a developer to add more fonts, they get pushback. Notice how compared to web pages, some print magazines show many more typefaces? We’re used to using few typefaces online, because loading more fonts makes the page slow. You can just make one yourself with by slicing up R, C and B and combining them with dashes. Like when you just got the perfect font for a retail website but there is no ₹, € or ฿ in it. More than once I ran into the issue of finding a font missing glyphs I really needed. After all, I only need the numbers 0–9 and a colon! Why create custom fonts?īesides icon fonts and ridiculously big countdown timers, there are three use cases for custom fonts I think are important.

For years I’ve been thinking of making my own typeface, so I thought it would be a nice exercise to figure out how feasible that would be. There were dozens of features I found more important than those tiny details, so I ignored the ink traps until it started to bug me that when in use, the UI blends out and all users see are those huge numbers. Spoiler: I created custom versions for all numbers anyway. When making this screenshot I realized that only the 7 and 2 clearly show an ink trap.

They complained about ‘ink traps or something’. And of course that caught the eyes of some designers using it. As a result, even on a medium-sized display every detail of a font will become visible. I put a lot of effort in making sure the numbers are as big as possible on any screen. Its biggest feature is that it’s, well, big.


In case you don’t know it yet: I want to make the best countdown timer for design workshops. A while ago I was asking for feedback on my countdown timer application, Big Timer.
