Link tags: font
252
How to create a typographic hierarchy – Pangram Pangram Foundry
- Start with the text
- Use size intentionally
- Contrast weights and styles
- Play with spacing
- Use colour, but don’t rely on it
- Limit your font choices (but choose well and wisely)
- Repeat, repeat, repeat
- Test your system
google webfonts helper
Google Fonts only lets you download .ttf files meaning that if you want to self-host your fonts (and you should), you have to first convert them to .woff2 files.
Luckily this tool has been online for over a decade, doing what Google Fonts should be doing by default.
Citywide – Jason Santa Maria
A fun new font from Jason:
Citywide is a sans serif family inspired by mid-1900s bus and train destination roll signs.
The hardest working font in Manhattan – Aresluna
This is absolutely wonderful!
There’s deep dives and then there’s Marcin’s deeeeeeep dives. Sit back and enjoy this wholesome detective work, all beautifully presented with lovely interactive elements.
This is what the web is for!
Introducing TODS – a typographic and OpenType default stylesheet | Clagnut by Richard Rutter
This is a very handy piece of work by Rich:
The idea is to set sensible typographic defaults for use on prose (a column of text), making particular use of the font features provided by OpenType. The main principle is that it can be used as starting point for all projects, so doesn’t include design-specific aspects such as font choice, type scale or layout (including how you might like to set the line-length).
The Beatrice Warde Memorial Lecture - St Bride Foundation
Oh, this looks like an excellent event (in London and online):
Adventures in Episodic Type Design
With David Jonathan Ross
Thursday 17th October 2024
Config 2024: In defense of an old pixel (Marcin Wichary, Director of Design, Figma) - YouTube
Everyone’s raving about this great talk by Marcin, and rightly so!
Some of the best free fonts | Clearleft
If you start with a high-quality, legible, free typeface and experiment with size, weight, colour, line height, and (subtle) letter spacing, you might find these free options will get you further than you’d think. These are professional fonts crafted and maintained by experts and they can help your content land the way it deserves to.
Marbla
A fun variable font with three axes: inktrap, balloon, and curve.
Monaspace
Five lovely monospaced variable fonts.
Wilco Loft Sans – SimpleBits®
How cool is this‽ Dan made a font for Wilco!
Typography Manual by Mike Mai
A short list of opinions on typography. I don’t necessarily agree with all of it, but it’s all fairly sensible advice.
Modern Font Stacks
This is handy—a collection of font stacks using system fonts. You can see which ones are currently installed on your machine too.
The most performant web font is no web font.
clamp() Calculator · Chris Burnell
Like a little mini Utopia:
Handy little tool for calculating viewport-based clamped values.
The Independent Type Foundry Advent Calendar 2022 · Matthias Ott – User Experience Designer
For 24 days this month, Matthias featured a different independent type foundry, writing about each one and selecting some lovely examplars of their typefaces.
Mona Sans & Hubot Sans
Two new lovely open source variable fonts from Github.
Why you should never use px to set font-size in CSS - Josh Collinsworth blog
Reminder:
emandremwork with the user’s font size;pxcompletely overrides it.
Fontshare: Quality Fonts. Free.
A whole lotta nice fonts—most of them variable fonts—from Indian Type Foundry.