You can enter your own text in place of the titles above and these paragraphs, just double click and type away.
Find Pair in ArchetypeArchetype: Pick font pairs, set sizing & spacing rules & export to CSS or Sketch. Makes creating harmonious typography quick & easy.
Find Pair in Archetype | Go to ToolA succinct article (by a hugely talented author...) covering core principles of pairing fonts with examples of the dos & don’ts.
Find Pair in Archetype | Go to ToolKnow your base lines from your cap lines: a glossary of some common typographic terms with lovely illustrations to make things clear.
Find Pair in Archetype | Go to ToolTitleCap: Paste in your text and this tool automatically capitalises the correct letters according to the proper rules.
Find Pair in Archetype | Go to ToolHemmingway Editor: Paste in your copy and this app highlights areas for improvement to make it bolder & clearer.
Find Pair in Archetype | Go to ToolTyp.io: Examples of attractive font pairings on live sites updated regularly. Search by font to find nice examples of it’s use.
Find Pair in Archetype | Go to ToolTypewolf: Shows trending font combinations again from actual sites to provide a better representation of how they work together.
Find Pair in Archetype | Go to ToolFontface Ninja: A free browser extension that let you inspect, try, buy and bookmark any fonts on any website
Find Pair in Archetype | Go to ToolFontPair: Further examples of interesting Google font pairs sortable by classification combination type e.g serif + sans serif
Find Pair in Archetype | Go to ToolProfessional Web Typography: Terrific free ebook, rich in detail and dedicated to the specific ins & outs of web based typography.
Find Pair in Archetype | Go to ToolAn oldie but a goodie: Detailed look at more font pairing best practices on Smashing Magazine with illustrated examples.
Find Pair in Archetype | Go to ToolBetter Google Font Finder: This tool allows you to search for Google fonts based on their visual attributes and similarities, great for font pairing.
Find Pair in Archetype | Go to ToolFontJoy: Beautiful looking tool, that will pick a pair of fonts using a neural net (insert ‘confused’ gif here…) at the touch of a button.
Find Pair in Archetype | Go to ToolNice post on the rules of responsive typography for the web including intro to grids and modular scales.
Find Pair in Archetype | Go to ToolModular Scale: Great interactive tool that gives a simple breakdown of what a modular scale is and how it works. Easy to understand and use.
Find Pair in Archetype | Go to ToolA List Apart article that looks at why using s modular scale results in web typography with natural size & spacing relationships.
Find Pair in Archetype | Go to ToolAn article introducing variable fonts and exploring how they could be used for more effective responsive design.
Find Pair in Archetype | Go to ToolGridlover: Another fine interactive tool that helps you establish a pleasing vertical rhythm and modular scale using simple sliders.
Find Pair in Archetype | Go to ToolCoolors: Wonderfully designed colour palette creator to help pick complimentary colours for your design & typography elements.
Find Pair in Archetype | Go to ToolType Scale: Inspired by the Modular Scale site of Tim Brown mentioned earlier but with a more visual preview of the final scale.
Find Pair in Archetype | Go to ToolThese Google font combinations have all been selected using font pairing best practices. The recommended body fonts all have multiple weight & style options for maximum versatility. Stay tuned for updates.
We also built Archetype, a tool to help choose and save compatible font combinations. It also makes harmonious typesetting for web projects a piece of cake. Take a look.