Font Pairing Tool
Select fonts and see them in action
CSS Code
HTML Link Tags
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
CSS Rules
/* Heading Font */
h1, h2, h3, h4, h5, h6 {
font-family: "Inter", sans-serif;
}
/* Body Font */
body, p, div, span {
font-family: "Inter", sans-serif;
}
Live Preview
The quick brown fox jumps over the lazy dog
Typography is the art and technique
Font pairing made simple
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Key Features
- Easy font selection and pairing
- Real-time preview updates
- Responsive design testing
- CSS code generation
Select a Font to Explore
Inter
Font Preview
Italic Styles
About
Inter is a typeface carefully crafted & designed for computer screens. It features a tall x-height to aid in readability of mixed-case and lower-case text.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Roboto
Font Preview
Italic Styles
About
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Open Sans
Font Preview
Italic Styles
About
Open Sans is a humanist sans serif typeface designed for legibility across print, web, and mobile interfaces.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Lato
Font Preview
Italic Styles
About
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Montserrat
Font Preview
Italic Styles
About
The old posters and signs in the traditional Montserrat neighborhood of Buenos Aires inspired Julieta Ulanovsky to design this typeface.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Playfair Display
Font Preview
Italic Styles
About
Playfair Display is a transitional design with high contrast and distinctive details, perfect for titles and headlines.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Merriweather
Font Preview
Italic Styles
About
Merriweather is designed to be a text face that is pleasant to read on screens. It features a very large x height, slightly condensed letterforms.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Lora
Font Preview
Italic Styles
About
Lora is a well-balanced contemporary serif with roots in calligraphy. It is a text typeface with moderate contrast well suited for body text.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Source Sans Pro
Font Preview
Italic Styles
About
Source Sans Pro is Adobe's first open source typeface family, designed by Paul D. Hunt. It is a sans serif typeface intended to work well in user interfaces.
Where to Get
Best Used For
Font Pairings
Recommended
Popular
Poppins
Font Preview
Italic Styles
About
Poppins is a geometric sans serif typeface with rounded letterforms that make it friendly and approachable while maintaining excellent readability.