Free for commercial use
Settings
Scroll
Get Elem
Elem
Your
New
Default
Font
AaBbCcDdEeFfGg
You want impact? You need a tight and crisp Display font.
You want legibility? You need a loose and easy Text font.
You want both but you can only pick a single font?
You need Elem.
Design
Subtle
When set big, Elem brings a powerful emphasis to your message. When set small, it lays low. Details of each glyph are subtle enough to get ignored while being read at small size. Minimalism of the core shapes then provides a comfortable reading experience.
Hybrid
Elem’s design takes the best out of both Text and Display fonts metric standards. A fairly tall x-height for improved legibility, and a single meeting line for ascenders and capitals, to make individual words blocky and impactful.
Tweakable
Since Elem was designed for a mixed use, it is meant for you to tweak it a bit. Its natural tracking is neither tight or loose. It looks right, no matter the case. And if you take a second to manually tighten it up on headlines (2% or more) and loosen it down on paragraph (2% or less), it will look even better.
UI Driven
Web and App usage is at the core of Elem’s conception. It was designed on a 8px grid, and shows up with a comfortable default line-height of 130%. Its metrics were carefully set to make sure that the actual text always look perfectly centered in its own block. Your UI components will look amazing.
Variable
Designers need more than just a Regular and a Bold version of a typeface. Developers need the product to load fast. And I want everyone to be able to throw a single file in the project and never worry about fonts again. Elem only exists as a variable font.
About
→
There are lots of different categories and genres (serif, sans-serif, humanist, geometric… it’s just like music). But when we moved from using lead shapes to digital type, we stopped using “one set of shapes to print in 12pt, another one to write to print in 16pt etc.” We now use only one font, no matter the size.
Fonts are not tailormade for their reading size anymore. Those including too many details became unusable (not legible enough) at small sizes. Two main groups naturally appeared, and each typeface sticks to one of them: “Display” or “Text”.
Are “perfect” fonts. They feature micro-details that makes them interesting to look at. They are designed with sharp angles, neat curves, tight tracking and a meticulously calculated kerning. Display fonts are gorgeous, but they need enough space to show off. Therefore, they are dedicated to headlines and logos.
Are made of compromises. Shapes are simplified, sometimes even lightly distorted, to make sure that each letter can be recognized from a distance. The x-height is tall, the tracking is loose. Text fonts are designed to be legible, not to stand out. They are dedicated to paragraphs.
Digital design has widely taken over print. Companies and startups must rely on brand identities that suit the web/app environment. And what matters in such environment is the loading speed (the weight of the font files) and accessibility (text legibility).
To reach this goal, they tend to play it safe. Pick a single typeface (less font files equals less weight), but a legible one (a Text font). Too bad if headlines look a bit flat, at least everything can be read without issues.
Is not a fresh or trendy font. It is the suggestion of a new standard, one that embraces digital constraints. Elem aims to be “the default font” that really works everytime. Because to me, Goddess Helvetica looks cluttered on paragraphs, and the beautifully clean San Francisco by Apple has nothing more to offer passed 20pt.
© Louis Marcos 2023
Motion Design by Gautier Gevrey
