Fraunces + Inter

What is Fraunces?

Fraunces is a high-contrast serif typeface inspired by the decorative serifs of the 20th century. Designed by Undercase Type, Fraunces is characterized by its dramatic optical sizing, which means the letterforms change subtly depending on the size at which they are set. This makes it particularly well-suited for headings and display text, where its elegant curves and high contrast can be fully appreciated.

• Styles available: Fraunces offers nine weights, from Thin to Black, each with matching italics, providing a wide range of options for designers.
• x-height: The x-height is moderate, which contributes to its elegant appearance but also requires careful consideration of font size for readability.
• Contrast: The high contrast between thick and thin strokes is a defining feature, making it visually striking.
• Where it shines: Fraunces excels in large display settings, such as headings, titles, and logos, where its unique design can be showcased.
• Where it struggles: Due to its high contrast and decorative nature, Fraunces is less suitable for small text or long-form content, where readability is paramount.

What is Inter?

Inter is a sans-serif typeface designed by Rasmus Andersson, specifically for user interfaces. It is one of the most popular fonts on Google Fonts, known for its clean, modern look and excellent readability at various sizes. Inter’s design is influenced by the needs of digital interfaces, making it a reliable choice for body text in web and mobile applications.

• Styles available: Inter offers ten weights, from Thin to Black, each with matching italics, providing ample flexibility for designers.
• x-height: The x-height is generous, contributing to its high readability even at smaller sizes.
• Contrast: Inter has a low contrast, which enhances its legibility and makes it suitable for a wide range of applications.
• Where it shines: Inter is ideal for body text, user interfaces, and any context where clarity and readability are key.
• Where it struggles: While Inter is versatile, it may lack the personality and visual impact of more decorative sans-serifs, making it less suitable for display purposes.

Why Fraunces and Inter work together

The combination of Fraunces and Inter creates a balanced typographic palette that leverages the strengths of each font. Fraunces’ dramatic and elegant design makes it an excellent choice for headings and titles, drawing attention and setting the tone for the content. Meanwhile, Inter’s clean and readable design ensures that body text is clear and accessible, providing a solid foundation for the overall design.

• Contrast in style: The high contrast of Fraunces complements the low contrast of Inter, creating a visually appealing hierarchy.
• Harmonious proportions: Both fonts have similar proportions and x-heights, which helps maintain a cohesive look across different text elements.
• Versatility: The wide range of weights available in both fonts allows for a flexible design approach, accommodating various design needs and preferences.
• Readability and personality: While Fraunces adds a touch of personality and elegance, Inter ensures that the text remains readable and accessible, striking a balance between form and function.

How to use this pairing effectively

To make the most of the Fraunces and Inter pairing, consider the following tips:

• Use Fraunces for headings and titles: Leverage the dramatic design of Fraunces to create impactful headings and titles that capture attention.
• Use Inter for body text and captions: Rely on Inter’s readability for body text, ensuring that the content is clear and accessible.
• Experiment with weights and styles: Take advantage of the various weights available in both fonts to create a dynamic and engaging typographic hierarchy.
• Consider color and layout: Use color and layout to enhance the contrast between the two fonts, further emphasizing the hierarchy and improving the overall user experience.

Alternative pairing: Playfair Display and Source Sans 3

If you’re looking for a similar aesthetic but want to try a different combination, consider pairing Playfair Display with Source Sans 3. Playfair Display, with its high contrast and elegant design, serves as a great alternative to Fraunces, while Source Sans 3 offers a clean and versatile sans-serif option akin to Inter.

• Playfair Display: Known for its dramatic serifs and high contrast, Playfair Display is ideal for display purposes and adds a touch of sophistication to any design.
• Source Sans 3: A highly readable sans-serif, Source Sans 3 is designed for user interfaces and provides a solid foundation for body text.
• Why it works: The combination of Playfair Display and Source Sans 3 offers a balance between elegance and functionality, similar to the Fraunces and Inter pairing.

Frequently asked questions

Is Fraunces suitable for body text?

Fraunces is generally not recommended for body text due to its high contrast and decorative nature, which can affect readability. It is better suited for headings and display text where its unique design can be fully appreciated.

Can Inter be used for headings?

While Inter can be used for headings, it is more commonly used for body text and user interfaces. Its clean and straightforward design may lack the visual impact of a more decorative serif like Fraunces, but it can still be effective in certain contexts.

Are these fonts web-safe?

Both Fraunces and Inter are available through Google Fonts, making them easy to embed in web projects. They are also open-source, which means they can be used freely for both personal and commercial projects.

What other fonts pair well with Fraunces?

In addition to Inter, Fraunces pairs well with other sans-serifs like Montserrat, Lato, and Open Sans. These fonts offer a clean and modern contrast to Fraunces’ elegant design, creating a balanced and harmonious typographic palette.