The lower x-height, the extended vertical proportions, the open forms and the carefully controlled spacing give Zutat a voice that stays precise without turning sterile. It holds up at small sizes and grows a distinct presence when set large. That is what makes it useful as an ingredient: it carries identities, interfaces and editorial layouts without taking them over.
Interface ready · Version 0.6
Zutat Font
Zutat is the German word for ingredient. It is the part you add so that everything else reads as considered. Aimed at identities, interfaces and editorial systems.
Move the pointer to study the form.
02 / Voice
Not the whole dish.
But the ingredient that decides it.
Zutat grew out of Geist, with a look sideways at DM Sans, Inter and SF Pro. What it keeps from them is the plainness, not the neutrality: tighter fitting, a deeper eye and slightly longer verticals give it a contour of its own without ever announcing itself inside an interface.
Open
Generous counters and simple forms keep the typeface legible, even when an interface gets dense.
Quiet
A steady rhythm and restrained details give complex information a dependable tone.
Exact
Matched spacing and a fixed vertical metric keep tables, figures and labels in line.
03 / Type tester
Make it yours.
Adjust the available family weights, size, slant, tracking, and alignment.
Style
Alignment
Reset
04 / Anatomy
Every point has a reason.
Inspect true vector outlines against the cap height, x-height, baseline, and descender.
05 / Specimens
A typeface in context.
Original Zutat Font posters, shown as part of the family rather than decoration.
06 / Use it
Four weights. One ingredient.
RegularAa400
MediumAa500
SemiBoldAa600
BoldAa700
Install
npm i zutat-font// app/layout.tsx
import { ZutatSans } from "zutat-font/font/sans";
export default function RootLayout({ children }) {
return (
<html className={ZutatSans.variable}>
<body>{children}</body>
</html>
);
}
/* styles */
font-family: var(--font-zutat), sans-serif;License & origin
Zutat Font is a custom typeface inspired by DM Sans, Inter, SF Pro, OpenAI's font and Geist. It is distributed under the SIL Open Font License 1.1.
Read the OFL 1.1 license ↗