The Quick Brown Fox
Typography is the art of arranging type to make written language legible, readable, and appealing when displayed.
Young Serif and Outfit are a serif and sans-serif pairing with strong contrast. Young Serif for headings, Outfit for body text. Young Serif has instant personality — warm, approachable, slightly retro. Outfit provides the modern geometric anchor. Great for newsletter landing pages, creative products, and brands with character.
YOUNG SERIF + OUTFIT
EDIT BELOW
USE THIS PAIR
# npm
npm install @fontsource/young-serif @fontsource/outfit
# yarn
yarn add @fontsource/young-serif @fontsource/outfit
# pnpm
pnpm add @fontsource/young-serif @fontsource/outfit
# Then import in your app entry point:
import '@fontsource/young-serif';
import '@fontsource/outfit';
# CSS usage:
# h1, h2, h3 { font-family: 'Young Serif', serif; }
# body { font-family: 'Outfit', sans-serif; }RECOMMENDED WEIGHTS · YOUNG SERIF
Single weight — display use only
OUTFIT
CHARACTER SET · YOUNG SERIF
OUTFIT
Young Serif
A warm, retro-inflected serif with instant personality. Its slightly naive, hand-drawn quality gives it an approachable, artisanal character that stands out from more formal serif choices.
Bastien Sozeau, 2013
serif · 1 styles
Recommended: 400
Outfit
A geometric sans-serif by Rodrigo Fuenzalida with a warm, contemporary feel. Its rounded geometry and even stroke widths create a clean, modern aesthetic popular in SaaS and product design.
Rodrigo Fuenzalida, 2021
sans-serif · 9 styles
Variable
Recommended: 400, 500, 600
Available: 100–900
Would Young Serif + Outfit work for my project?
Sends this question and a link back to this page.
The Quick Brown Fox
Typography is the art of arranging type to make written language legible, readable, and appealing when displayed.
The Quick Brown Fox
Typography is the art of arranging type to make written language legible, readable, and appealing when displayed.
The Quick Brown Fox
Typography is the art of arranging type to make written language legible, readable, and appealing when displayed.