Darker Grotesque + Wix Madefor Text
Grumpy wizards make toxic brew
A standfirst set in Wix Madefor Text, one size up — where a pairing starts earning trust.
The five boxing wizards jump quickly over the lazy dog, mixing jugs of quiet vodka while the jury watches. Click anywhere in this preview and type your own text to try the pairing.
“Type is a beautiful group of letters, not a group of beautiful letters.”
— Matthew Carter
Fig. 1 — Darker Grotesque over Wix Madefor Text, in the wild.
Darker Grotesque 800 / Wix Madefor Text 400 — click any section and type your own copy.
Why it works
Darker Grotesque's tall, tightly-spaced display face stretches headlines into a fashionable, poster-like statement, and Wix Madefor Text answers with a friendly, rounded humanist sans that keeps the body calm and readable. The exaggerated proportions up top need a plain, quiet companion below — that deliberate imbalance is what gives an editorial cover its drama without exhausting the reader.
More about each face: Darker Grotesque · Wix Madefor Text
Use this pairing
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Darker+Grotesque:wght@800&family=Wix+Madefor+Text:wght@400;600&display=swap" rel="stylesheet">h1, h2, h3 {
font-family: 'Darker Grotesque', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 800;
}
body {
font-family: 'Wix Madefor Text', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 400;
}import { Darker_Grotesque, Wix_Madefor_Text } from "next/font/google";
const heading = Darker_Grotesque({
subsets: ["latin"],
weight: "800",
variable: "--font-heading",
});
const body = Wix_Madefor_Text({
subsets: ["latin"],
weight: "400",
variable: "--font-body",
});