Repository navigation
We're excited to announce a new member to our font family: Geist Serif
It's a high-contrast display serif with fine, saw-toothed serifs and sharp hairlines. Its Regular and Square variants are suited to primary typography, while Triangle and Heart offer more decorative alternatives.
It includes four distinct variants, each exported separately:
| Export | CSS Variable | Description |
|---|---|---|
GeistSerifRegular |
--font-geist-serif-regular |
Round dots (the default) |
GeistSerifSquare |
--font-geist-serif-square |
Square dots |
GeistSerifTriangle |
--font-geist-serif-triangle |
Triangular dots, a nod to the Vercel logo |
GeistSerifHeart |
--font-geist-serif-heart |
Heart-shaped dots |
import {
GeistSerifRegular,
GeistSerifSquare,
GeistSerifTriangle,
GeistSerifHeart,
} from "geist/font/serif";Or load all four as one variable font and pick a shape with the ELSH axis (0 Regular, 25 Square, 50 Triangle, 100 Heart):
import { GeistSerif } from "geist/font/serif/variable";