Fun With Fonts
With FontDrop! I made a little web application that shows the content of a font file. Just drop a .otf, .ttf ot .woff-file to see what’s inside of them.
I thought it would be fun to have a look in some files and and to show some cool fonts on this website. This year I will try to present a new file every now and then and write some background information about it here.
Just go to www.fontdrop.info, the presented font file will be the initial font that you see. Dropin’ your own files works as usual.
Let’s have some Fun With Flags ..ah, Fonts!
#10 An Unfinished Funt
In the last episode of this journey through different font files we look at a work-in-progress font project from my own drawer. You might recognize the similarity of the letter-forms with the letters of the *Fun With Fonts* splash graphic at the top of this article. And yes, it is the evolution of this letters, it is version 0.011 of this typeface idea, which made quite a few steps from it’s initial inspiration to this point, and this might not be the last version.
I decided too show this project because FontDrop! is not only a great tool for quickly examine font files, but also as a testinng tool in the type design process. It enables a quick way to preview text and all characters on screen. With the subpage /compare I can look at two versions of a typeface next to each other. This is especially in the spacing and kerning process helpful or to check the effect of small changes for body text. Of course, this Unfinished Funt project is not a text typeface, but even here, changing the environment from the font editor to the desktop app helps sometimes to keep the view on the letter design fresh and objective.
As you can see the typeface is uppercase only, but every letter exist twice times. A Contextual Alternates (calt) feature will exchange letters automatically while typing. The concept for this typeface is, to work with different layers. I just added one of these extra layers as a Stylistic Set (ss01).
Fun Tip: Keep an eye on the version number every now and then, and try to spot the progress ;-D
#9 WHOA Published As A Future Font
WHOA is a font with a capital FUN factor implemented! WHOA is a type experiment, an exploration of font technology and a bunch of playful letters. WHOA was designed by Travis Kochel (Scibble Tone) and released on the platform Future Fonts, a platform for experimental and mostly unfinished typefaces. Type lovers can buy these typeface on an early stage and support its progress this way. WHOA currently comes in version 0.3.
WHOA is a variable font (OpenType Font Variations) with four axes: Horizontal Offset (hrzn), Vertical Offset (vert), Rotation (rota) and Zoom (zoom). Dragging the sliders will change the look of the letters onto those dimensions. There is a number of predefined instances, like Slide or Spinebox and many more.
At this point the typeface comes with a very basic set of glyphs, no extra OpenType features or ligatures. A wider language support is planned, and also other enhancements. You can take a look at the version notes of WHOA.
Pro Tip: You might notice that the file contains only 87 glyphs, but supports 34 languages anyway. There is a new a subpage on FontDrop! with a more detailed language report, check out: https://fontdrop.info/#/languages
Fun Tip: Using variable fonts with CSS animations and/or mouse hover effects is a great fun … here is a tutorial.
Have FUN with WHOA: https://fontdrop.info/#/?funfont=WHOA
#8 Chikki by Mota Italic
The typeface Chikki was designed by Kimya Gandhi and Rob Keller by Mota Italic. The foundry has an excellent expertise in typefaces that combine Devanagari and Latin language support. You will notice FontDrop! needing quite some time to parse and display this file, because it is full of features and glyphs.
Chikki comes with a bunch of OpenType features that I’ve never heard of before. Most of them probably needed for a proper Devanagari language support.
FontDrop! looks for Devanagari, Gurmukhi, Gujarati, Kannada, Telugu and Oriya script in it’s language detection and FontDrop! comes with a Devanagari sample text and pangram sentence in the Waterfall section.
Enjoy and play around with Chikki: https://fontdrop.info/#/?funfont=Chikki
#7 An Icon Font
In this chapter of Fun With Fonts we will have a closer look at an icon font. In the digital world icons fonts play a crucial role for all the U and X and U and I. There is a lot of well made and extensive icon fonts out there but I’ve picked the Google Material Icons font and I did it for a reason!
From the perspective of the font files format, icon fonts usually are really basic constructions (we are not talking about colored icon/emoji fonts here, which would be a whole different topic and these font are unfortunately not supported by FontDrop!). You have the outlines of each icon, a little bit of meta data, but there is no kerning and no OpenType features … usually! The Material Icons font comes with a very special feature — Required Ligatures! An this feature is really worth to have a closer look at:
All the icons in this font come as a descriptive ligature, see the Ligatures tab and Type Yourself!
So there are ligatures in the icon font and these are required, which means: it is not possible to turn them off! In FontDrop! you will see a button for this feature, but this button has no effect.
The OpenType specs know two more required features: Required Contextual Alternates — like Contextual Alternates feature, but not possible to turn off. And Required Variation Alternates — used in OpenType Font Variations (variable fonts).
Pro tip: When working in an exciting web projects that uses an icon font, FontDrop! is a quick way to get yourself an overview about the content of this font.
Have fun with the Icons: https://fontdrop.info/#/?funfont=Icons
#6 Kommune Inline by Verena Gerlach
Brutalism seems to be a little trend in type design. Kommune Inline by Verena Gerlach is based on African shop signs and letterings and was developed in connection with an exhibition of the work of architect Francis Kéré. Kommune Inline is part of really large type family project, with Kommune and Kommune Stencil. The typeface is published by polish type foundry Laïc.
The strong design is speaking for itself. The letterforms invite for an expressive use in large sizes and to play with it. The font comes with an number of stylistic alternates (Stylistic Sets), which you can easily try out in FontDrop!
Fun tip: This typeface is perfect to create patterns from letters!
See Kommune Inline: https://fontdrop.info/#/?funfont=KommuneInline
#5 Arapix by 29LT
With Arapix by type-designer Sylvain Mazas we’ve got an Arabic font in this little Fun With Fonts adventure. Arapix is a pixel font, based on a 12px grid. It is published by the type foundry 29Letters [29LT], that works in the fields of multi-script typefaces.
The few things I know about Arabic script are: It is set from right to left (RTL). There is no uppercase and lower case letters. A letter can look differently, depending on it’s position in a word. This is where some heavy OpenType feature coding becomes essential.
The initial (init), medial (medi) or final (fina) form of each letter will automatically set into words by the Opentype technology. FontDrop! shows these forms as single characters in the OT section by using a little trick: An invisible character — the so called Zero Width Joiner—is put before (fina), after (init) or before and after (medi) the characters.
One more thing about OT features in FontDrop!: You might wonder, why you can see a Linning Figures feature (lnum), but the field is empty, while the field for Old Style Figures (onum) shows the old style numbers correctly? It seems that in this case lnum-figures are substitute characters of other substitute characters. With the feature code the browser will only show substitute characters that have a Unicode. Substitutes of substitutes usually are none-Unicode characters.
Pro tip: When writing words in Arabic in the Type Yourself section, FontDrop! will change the direction of the text to Right-to-Left (RTL) automatically!
See Arapix: https://fontdrop.info/#/?funfont=Arapix
#4 ‘A Google Font’
Still most of us are in some kind of #StayHome situation, maybe with some extra time to spend, and I thought it might be a good situation to check some fonts from one of the largest online and free font libraries: Google Fonts (nearly 1.000 typeface so far!)
While free fonts for a long time was synonymous for low quality, not really usable, but for headlines OK, Google managed to build up a respectable collection of contemporary typefaces. Some of them like Roboto, Open Sans or Source Sans can for sure be called classics of modern web design. One of them set really an own new standard in language coverage. You can download all of these typeface at the Google Fonts website and check out in FontDrop!
I thought it might be more fun to look at some font that is not such a celebrity. Google has a usage analytics site of all the typefaces and I jumped directly to the bottom and picked the last: Viaoda Libre.
This decorative, strong contrast typeface comes with some playful little details. The description of it says it is ‘… inspired by Vietnamese cultural symbolism.’ FontDrop! supports Vietnamese language detection and Vietnamese preview texts!
Pro tip: There is a bug in some of the OpenType features for the figures: Look at the OT tab in FontDrop! and see at the feature sups (Superscript) — the zero is not really superscript. Also sinf (Scientific Inferiors) and subs (Subscript) are not working correctly. But there is a newer version of this typeface available on GitHub. This version has more features and fixed bugs. FontDrop! is a good tool to quickly compare different versions of a typeface.
See Viaoda Libre: https://fontdrop.info/#/?funfont=ViaodaLibre
#3 Buchstabenmuseum Berlin
In these days of spring 2020 everything is different. The globalized world faces a situation like never before. There is just one topic, everything else is of minor interest, especially featuring fonts doesn’t seem like an appropriate news.
In the beginning I thought about taking a break with my little fun project, as long as this crisis goes on, but then, by reading my Twitter feed, I came to the idea that Fun With Fonts might help to point the attention to a place that needs support now. (I’m aware that there are tons of organizations and places that need help and solidarity right now and this is just one possibility.)
Currently, the Buchstabenmuseum Berlin is closed like most other museums in Berlin and worldwide. If you like letters, consider helping the Buchstabenmuseum Berlin by purchasing a gift voucher for later use.
On their website the museum provides a font that can be downloaded for free. Originally the Buchstabenmuseum font was kind of my joker, a fallback for the situation I couldn’t manage to produce a new issue of Fun With Fonts fast enough. This font of traced vintage letters from the Buchstabenmuseum Berlin seemed of minor usability but predestined for the category FUN.
The Buchstabenmuseum website credits LucasFont as producer of this font, even though the folks at LucasFonts did not put their credits into the fonts meta data. (Usually if you find a font without meta data, it is a certain sign of bad quality and you should get your hands off it. But in this case of a fun font, this can be ignored, I guess.)
The font is a bridge between the analogue world of vintage letters and old shop signs and the digital world of fonts. Play a little memory, and try to recognize the origins of the letters!
Check out the font: https://fontdrop.info/#/?funfont=Buchstabenmuseum
Support the museum!
Stay save!
#2 Nouvelle Vague by AnatoleType
In the second edition of Fun With Fonts we’ve got a lively and expressive script font by type designer Elena Albertoni, published on her own label AnatoleType, called Nouvelle Vague.
Although the font contains less than 300 glyphs the typeface gives us a vivid and varied impression. Contemporary script typefaces often come with hundreds of glyphs and a dozen alternates for each character to produce this effect. Nouvelle Vague does not need that, which makes it a lightweight font, especially useful for online applications.
All lower case letters in the font are connected by default and a handful of ligatures helps to make the shape of the words more unique (see /l/l). The Contextual Alternates feature (calt) does some more magic, changing some letters at the beginning and at the end of a word (try letter /g as inital letter and /g in the middle of a word).
Pro tip: In the OT (OpenType) tab you will find a long list of letter combinations of the Contextual Alternates (calt) feature. The calt-feature changes the look of one letter in these combinations. Some of these combinations doesn‘t seem to make any sense or seem to be obsolete — the reason is that in the feature code not single letters are stored, but classes of letters, e.g. [/a/á/â/ä/à/å/ã/ã/æ] is a class for all /a-glyphs.
See Nouvelle Vague: https://fontdrop.info/#/?funfont=NouvelleVague
#1 Vestmar by Monokrom
The first font we see is Vestmar, a release by the Norwegian foundry Monokrom. Vestmar is a sans serif typeface with some interesting balance and symmetry. The foundry Monokrom has a handful of pretty unique and outstanding type designs in stock and Vestmar is it’s latest addition.
The font file is not of a single weight, it has a range of weights from Thin to Black, it is a Variable Font — the latest in font technology! Check out the axes sliders and the predefined weights and styles.
Vestmar comes with 770 glyphs and some useful OpenType features, that you can try out on the FontDrop! website.
Fun fact: Vestmar even has got an interrobang and a asterism character.
Pro tip: Vestmar comes with some built-in sample text, that gives us some info about the design and intention of this typeface.
See Vestmar: https://fontdrop.info/#/?funfont=Vestmar
