A bookmarklet and browser extension for identifying type on websites.
× Identifying type ×
A bookmarklet and Chrome extension for identifying and sampling web fonts.
A bookmarklet for identifying type on websites.
× Trying type ×
A website for playing with a wide range of variable fonts.
A design tool for testing type / variable fonts in the browser without writing code.
A design tool for generating a large range of typography design permutations.
An interactive game in the browser for practicing typographic kerning.
A web tool for testing fonts across a wide variety of languages and sizes.
Preview, evaluate, and compare typefaces for web use.
A tool for comparing and setting type in the browser.
A game for learning about how to match and pair typefaces.
× Working with text ×
A tool that generates more realistic placeholder content by pulling from famous texts.
A tool for generating set paragraph strings for proofing.
A tool for generating paragraphs with certain sets of characters as proofs.
A search engine for Unicode. Explore, reference, and copy and paste characters (including their HTML entities). Handy when you don’t know what to type to get a specific symbol.
× Measuring ×
A web application for setting a typographic system and modular scales.
A tool for defining and viewing modular scales on the web, with Sass and JavaScript.
A calculator for finding the relationships between viewing distance as well as the physical and perceived sizes of type.
A tool for getting interpolated values.
Make and manage responsive grid systems for web compositions.
× Making typography flex ×
A formula for responsive/fluid line height, available as scripts or style calculations.
Techniques and examples for fluid type with CSS calc.
An application for fitting type to its container.
× Managing typographic details ×
A preprocessor for web typography with no client side Javascript. Gives you hanging punctuation, soft hyphen insertion, optical margin outdents, small-caps conversion and punctuation substitution.
A script to automatically fix the rag of any body of text. Set how and where you want your lines to break.
jQuery plugin for fine-grained control over spacing individual letters.
A script for setting drop caps.
× Reviewing contexts ×
A tool for evaluating legibility by simulating different viewing conditions.
A way to quickly test and try different fallback fonts for a site.
An application for accurately simulating a low-resolution screen, for people who normally design using a high-resolution screen.
× Gauging support ×
Comprehensive compatibility tables for default local fonts across different operating systems.
A comprehensive resource for support of various typographic features across the web.
× Responding to conditions ×
A script for styling with typographic CSS properties that don’t yet exist, including kerning adjustment, rag adjustment, widow control, and min-/max-font-size. A compilation of Nathan’s individual scripts.
Script that detects the text rasterizer and antialiasing that a visitor’s browser is using, so you can style accordingly.
× Optimizing font loading ×
A script for more control of loading of web fonts via @font-face, even if they’re from multiple sources.
A script that stores CSS @font-face in localstorage for fast loading on a user’s second visit.
A script for setting up callbacks as fonts load using the CSS Font Loading Module.
A script for setting up callbacks as fonts load, using the CSS Font Loading Module with a full polyfill.
× Making typefaces ×
An online tool for creating and generating geometric typefaces.
A web tool for generating ideas and constraints when designing typefaces.
An application for drawing type and producing fonts.
A suite of type plugins (for Fontlab and Glyphs) that help tune and generate glyph designs.
A tool for type design. Comes packaged with a lot of functionality. Extendable in Python scripts.
A tool for type design with an emphasis on being easily extendable in Python.
An application for preparing fonts for interpolation compatibility.
An application for multi-dimensional font interpolation during the type design process.
Code to scale and animate SVG shapes flexibly through interpolation.
An application for generating graphics algorithmically.
Speed up the designing process of small caps, inferior, superior, condensed and extended variations. An application for interpolating sets of UFO glyphs.