Web Typography Quiz

Web Typography Quiz

by Matej Latin

Web typography is a bit tricky. Take this web typography quiz and test your typography knowledge.

A Guide to Rhythm in Web Typography

A Guide to Rhythm in Web Typography

by Matej Latin

Vertical and horizontal rhythm in web typography.

Font Memory Game

Font Memory Game

by Matej Latin

Recognizing different styles of fonts is one of the most challenging parts of typography. This game helps you train your eyes to notice the smallest details.

Equilateral Triangle of a Perfect Paragraph

Equilateral Triangle of a Perfect Paragraph

by Matej Latin

A learning game that teaches players how to shape typographically perfect paragraphs.

A Guide to Combining Fonts

A Guide to Combining Fonts

by Matej Latin

Five guidelines for making awesome font combinations.

Better Web Typography for a Better Web

Better Web Typography for a Better Web

by Matej Latin

A comprehensive web typography book for web designers and web developers.


Universal Typography

by Tim Brown

The web is universal and, in this renewed talk, Tim Brown shows how to practice typography in a way that is equally universal.

Typography Inspector

by Bram Stein

Typography Inspector analyses the typography on your site and helps you improve it.

Typography Handbook

by Kenneth Wang

A concise, referential guide on best web typographic practices.


by Dmitry Gerasimov

Better typography for Sketch.

On Web Typography

by Jason Santa Maria

Through an understanding of our design tools and how they relate to the web as a medium, we can empower ourselves to use type in meaningful and powerful ways.

More Perfect Typography

by Tim Brown

At long last, designers can use real fonts on the web. But what now? Where do we go from here?


by Rowan Cavanagh Stein

Measure typographic line lengths right from the page.

Kerntype—a Kerning Game

by Mark MacKay and María Munuera

Train your eyes to become a pro at kerning with this fun kerning game.

Better Web Type

by Matej Latin

A free web typography course for web designers & web developers.


by Adam Becker Stein

Character counter for helping to optimize line length (measure) between 45 and 75 characters.

Font Tools

Modern Fluid Typography Editor

by Adrian Bece

A tool that makes it easy to use the CSS’ clamp function for fluid typography.

Fallback Font Generator

by Brian Louis Ramirez

Reduce Cumulative Layout Shift by adjusting web fonts and system font fallbacks using special @font-face descriptors.

Modern Font Stack

by Dan Klammer, Coling Gourlay, Troy J. Farrell, Pete Cooper

The fastest fonts available. No downloading, no layout shifts, no flashes — just instant renders.


by FontTools

A library to manipulate font files from Python.

Wakamai Fondue

by Pixel Ambacht

See what features your font supports


by OddLabs

Modern and simple css @font-face generator


by RightFont Team

Sparking font manager to preview, sync, install and organize fonts, with flawless integration into any design software.


by Fontown Team

Fontown is a beautiful typefaces library ready-to-use with a powerful application to organize and share your fonts.


by FontForge Team

FontForge is a free and open source font editor brought to you by a community of fellow type lovers.


by Monotype

Install fonts from participating sites with a single click. Fonts are installed from the cloud on your computer in seconds.


by Dominik Levitsky Studio

FontBase is a free, beautifully crafted font utility for designers, that gives you all the possibilities of Fontcase.

FontBuddy for Sketch

by Anima App

Never deal with missing fonts again.


by Johan Mattsson and Marko Jovanovac

Birdfont is a free font editor which lets you create vector graphics and export TTF, EOT and SVG fonts.

Typeface Anatomy

Typography Glossary

by FontShop

A glossary of common type terminology.

Type Terms

by Supremo

The animated typographic cheat sheet.

Anatomy of a Typeface

by Typedia

Learn about the anatomy of typefaces.

Recognizing & Choosing Fonts


by myfonts.com

Instant font identification powered by the world’s largest collection of fonts


by Chengyin Liu

The easiest way to identify fonts on web pages.

WhatFont iPhone App

by Chengyin Liu

The easiest way to identify fonts on web pages for iPhone.

Web Font Previewer

by JustinTheClouds

This extension allows you to test webfonts out on any website and target which elements the fonts should be applied to.


by typewonder.com

This extension helps you to test webfonts on active chrome tab via typewonder.com.

TypeKit Tweaker

by kylefox.ca

A toolbar that lets you adjust Typekit font previews.

Web Font Specimen

by Tim Brown

Web Font Specimen is a handy, free resource web designers and type designers can use to see how typefaces will look on the web.

Type Classifications

by Allan Haley

An overview of type classifications.

Google Font Previewer for Chrome

by Pamela Fox

Lets you choose a font from the Google Font directory with a few text styling options, and preview them on the current tab.


by FontStand Team

Try fonts for free or rent them.

FontFace Ninja

by fontface.ninja

Fontface Ninja is a browser extension that lets you inspect, try, bookmark and buy fonts on any websites.

Combining Fonts


by Typio

Find inspiration for combining fonts.


by Rafal Tomal

Free inspirational web font combinations with color palettes and ready-to-use HTML/CSS code.


by FontPair

An awesome collection of font combinations from real websites. Inspiring stuff.

Font Combinations

by Canva

Find a font combination for your design needs.


by H&Co.

An inspiring collection of fonts and font combinations by H&Co.

Combining Typefaces

by Tim Brown

Free book on combining typefaces.

Beautiful Web Type

by Chad Mazzola

A showcase of the best typefaces from Google Fonts.

A Guide to Font Pairing

by Martin Olliviere

A quick and basic guide to font pairing.

Variable Fonts

Variable Fonts

by Nick Sherman

A simple resource for finding and trying variable fonts.

One File, Many Options

by Ollie Williams

Using Variable Fonts on the Web.

Font Playground

by Wenting Zhang

Play around with variable fonts.


by Laurence Penney

A website for playing with OpenType variable fonts.



by David Merfield

A ty­po­graphic pre-proces­sor for your html which uses zero client-side JavaScript and gives you advanced typographic features.

Normalize OpenType

by Kenneth Ormandy

Adds OpenType features—ligatures, kerning, and more—to Normalize.css.

OpenType Features in Web Fonts

by Alex Muñoz

A list of all OpenType features with examples.

Syntax for OpenType Features in CSS

by Adobe

Individual OpenType features and how to use them in CSS.

Vertical Rhythm


by Aleksander Nowodzinski

Syncope is a WYSIWYG tool for establishing vertical rhythm on websites.

Gutenberg Web Typography Starter Kit

by Matej Latin

A meaningful web typography starter kit.


by Tuomas Jomppanen & Ville V. Vanninen

Establish a typographic system with modular scale & vertical rhythm.


by Martin Olliviere & Jamie Gilman

Create beautiful web typography designs, in the browser.

Visual Hierarchy

Typographic Scale

by Henryk Wollik

This plugin generates a typographic scale from selected text layers.


by Oleg Frolov

Base your designs in Sketch on Modular scales.

Modular Scale

by Scott Kellum and Tim Brown

The Modular Scale calculator multiplies your scale’s base with a ratio to produce a scale of numbers that are proportionally related.

Modular Scale (Sass)

by Scott Kellum

Modular scale calculator built into your Sass.


by Hu2la

A Bot that suggests font sizes for web pages.

Gutenberg Web Typography Starter Kit

by Matej Latin

A meaningful web typography starter kit.


by Tuomas Jomppanen & Ville V. Vanninen

Establish a typographic system with modular scale & vertical rhythm.


by Martin Olliviere & Jamie Gilman

Create beautiful web typography designs, in the browser.