#typography (169 links)
- CJK Typesetting in 2025: Challenges, Workflows, and Best Practices asianabsolute.co.uk
- Reimagining Fluid Typography | OddBird oddbird.net
Relative units like em and rem are excellent for internal relationships – keeping the scale consistent between body text and headings, for example. But things always go wrong when we try to treat em as an alias for px, with mental conversions based on their assumed default relationship. At that point we’re keeping zoom, but discarding everything else about the user preference.
- Fonts Knowledge - Google Fonts fonts.google.com
- Japanese Text Layout for the Future* (hint: there isn’t one) atadistance.net
Somehow we forgot how to center rectangles and must find our way back
- Why has The Economist changed its typeface? economist.com
Keen-eyed readers will have noticed that our website, app and print edition look different
- Retrofitting fluid typography clagnut.com
- Why Do Everyone’s Logo Fonts Look the Same? justcreative.com
Throughout this piece, we’ve talked about the sans-serifs and the utilitarian nature of their design. But perhaps their greatest sin is that they often lack personality. When more and more customers are looking for a more human relationship with brands, having the same logo font as everyone else just doesn’t cut it.
- Geist Font — Vercel vercel.com
Geist embodies our design principles of simplicity, minimalism, and speed, drawing inspiration from the renowned Swiss design movement.
Forked from Inter, apparently
- Modern Font Stacks modernfontstacks.com
System font stack CSS organized by typeface classification for every modern OS. The fastest fonts available. No downloading, no layout shifts, no flashes — just instant renders.
- typo/graphic posters typographicposters.com
- Right-to-left Styling rtlstyling.com
- OpenType Features simoncozens.github.io
- How the pandemic made fonts friendlier | The Economist economist.com
The latest big name to follow suit is O2, a telecoms company. The brand is dropping Frutiger, the banal Humanist Sans it has used since 2002, for On Air, a new typeface created by Monotype.
- Butterick’s Practical Typography 2nd edition practicaltypography.com
New in the second edition: emoticons and emoji, metrics vs. optical spacing, free fonts, Century Schoolbook alternatives, grids, screen-reading considerations, responsive web design, how to work with a designer, the copyright status of fonts, how this book was made, and typographic humor.
- The typographic scale spencermortensen.com
- Inter font family rsms.me
Inter is a typeface carefully crafted & designed for computer screens.
- Text for Proofing Fonts | Fonts by Hoefler&Co. typography.com
- Home | Utopia utopia.fyi
<blockquote> Utopia emerges when designers and developers share a systematic approach to fluidity in responsive design. Instead of designing for x number of arbitrary breakpoints, we can design a system within which elements scale proportionally and fluidly.</blockquote>
- Simplified Fluid Typography css-tricks.com
Fluid typography is the idea that font-size (and perhaps other attributes of type, like line-height) change depending on the screen size (or perhaps container queries if we had them). The core trickery comes from viewport units.
It’s hard to pick a font size that is just right, especially as you try to adapt to different screens and scenarios. Looking at the recent history of how we got here can give us some perspective.
- Textblock textblock.io
- Has the Internet Killed Curly Quotes? theatlantic.com
- Font style matcher meowni.ca
- Flexible typography with CSS locks blog.typekit.com
- One Weird Trick to Baseline-Align Text | Web Platform Team Blog blogs.adobe.com
- Dev.Opera — The State of Web Type dev.opera.com
- OpenType features — Typofonderie typofonderie.com
Nice visual run-down of OpenType features.
- TYPEKIT | Using OpenType features in CSS help.typekit.com
<blockquote>OpenType features are like secret compartments in fonts. Unlock them and you’ll find ways to make fonts look and behave differently in subtle and dramatic ways. Not all OpenType features are appropriate to use all of the time, but some features are critical for great typography.</blockquote>
- State of Web Type stateofwebtype.com
<blockquote>Up-to-date data on support for type and typographic features on the web.</blockquote>
- Fixed Monospace Sizing meyerweb.com
<blockquote>Monospace text sizing is, from time to time, completely unintuitive and can be quite maddening if you don’t look at it in exactly the right way.</blockquote>
- The 62.5% Solution? | Tracy Rotton taupecat.com
<blockquote>the whole idea of converting pixels to ems is pointless. Use ems where you need something to scale with the font size of the component, rems for something that scales with the base font-size and pixels where you need an absolute value that doesn’t depend on the font-size whatsoever etc. Different units have different purposes. </blockquote>
Lea Verou makes a good point.
- Firefox 4: OpenType font feature support hacks.mozilla.org
Some excellent live examples.
- Alien | Typeset In The Future typesetinthefuture.com
<blockquote>My third post about typography in sci-fi has been gestating for a while now...</blockquote>
- ekalinin/typogr.js github.com
<blockquote>Typography utils for javascript</blockquote>