Add to ChromeBraveFind, test and swap fonts in Chrome
?PsstPoint at a letterI’ll name the font.
Point at any text to see the typeface that actually rendered, who made it, and the CSS to use it.
Issue 12 · Autumn
Twelve recipes, each set in a typeface its designer chose.
We asked twelve type designers for their favourite soup and set every recipe in the face they drew. Also inside: a heated argument about ligatures.
Recipe no. 4
Leek & potato, emphatically.
Miso ramen 味噌 ✷
Slurp responsibly.
CSS lists fonts in order of preference, and your browser draws with the first one it has. Fontsight tells you which one that was and crosses out the rest.
font-family: "Söhne", "Helvetica Neue", Arial, sans-serif;This sentence uses that exact stack. On your computer, you’re reading it in the first one your browser has.
The page never loaded a bold, so the browser smears the regular. Fontsight calls it out.
Characters the font doesn’t have, quietly drawn by another one.
Sizes that almost match and text that’s hard to read, listed in the side panel.
Press W on any website and the whole page re-sets as you glide along a strip of fonts. Here’s that strip. Go on, glide.
✎ Type your own words
Swap the fonts on any website.
Press T on any card for every style the site loaded, a waterfall of sizes, your own words and every glyph. Here it is, on this page’s own font.
Bricolage Grotesqueby Mathieu Triay · Google Fonts · free200Pack my box with five dozen liquor jugs
300Pack my box with five dozen liquor jugs
400Pack my box with five dozen liquor jugs
500Pack my box with five dozen liquor jugs
600Pack my box with five dozen liquor jugs
700Pack my box with five dozen liquor jugs
800Pack my box with five dozen liquor jugs
12pxPack my box with five dozen liquor jugs
14pxPack my box with five dozen liquor jugs
16pxPack my box with five dozen liquor jugs
18pxPack my box with five dozen liquor jugs
21pxPack my box with five dozen liquor jugs
24pxPack my box with five dozen liquor jugs
32pxPack my box with five dozen liquor jugs
40pxPack my box with five dozen liquor jugs
48pxPack my box with five dozen liquor jugs
64pxPack my box with five dozen liquor jugs
Type is a beautiful group of letters, not a group of beautiful letters. A good typeface disappears into its text; a great one sets the tone before anyone reads a word. Try your own words above, and watch every style keep its shape.
U+0041A directory built into the extension: 7,800+ families from 183 type houses, plus the in-house fonts of 98 brands. Each one links to the family’s own page.
Dinamo
TypothequeAirbnb Cereal183type houses
Klim Type FoundryNetflix Sans
Dalton Maag
Grilli Type
Fontwerk
OH no Type Co.
Bold MondayMeans
DJR7,800+families
DisplaayFigma SansSpeedee
Pinterest Sans
Emigre
Pangram Pangram
205TF
LinetoVW Head
Sharp Type
Optimo
Collletttivo
Frere-Jones Type
Hoefler&Co.gg sansFeather Bold
Swiss Typefaces
Commercial Type
Production TypeSpotify Mix98brands’ own fontsGo on, throw them around.
Add Fontsight to Chrome, open the page, and press ⌥⇧F on a Mac or Alt+Shift+F elsewhere. Point at any text and Fontsight shows the typeface, its weight and size, who made it, and the CSS to use it. You can also click the toolbar icon or right-click and choose “Identify this font”.
The one that rendered. CSS lists fonts in order of preference, and the browser draws with the first one it has. Fontsight checks which one that was, and crosses out the fallbacks it skipped.
Yes. Pin any text and press Swap. Fontsight resets that text, or every element set like it, in a font the page already has, one installed on your computer, any Google Font or your own font file. Glide along the strip and the page changes as you go. Adjust size, weight, leading and tracking, hold Shift to compare with the original, then copy the CSS. Esc puts the page back exactly.
Yes. A directory built into the extension covers 7,800+ families from 183 type houses, plus the in-house fonts of 98 brands. Each one is marked free, commercial or in-house, with a link to the family’s own page.
Yes. Fontsight is free, with no account to make.
No. Fontsight looks at a tab only when you ask it to, by pressing the shortcut, clicking its icon or using the right-click menu.
Yes. Both install Fontsight from the Chrome Web Store. In Edge, choose “Allow extensions from other stores” when it asks, then click Add to Chrome.
Fontsight is a Chrome extension, so it lives on your laptop or desktop. Send yourself the link and meet it there.
Press them now. This page is listening.
Add to ChromeBrave FreeNo account. Fontsight reads a page only when you ask it to.