Vercel
- Pages (4)
- Style sheet
- Measured from 4 Pages
- Captured Oct 26, 2026
- Built with Custom code
Summary
Across 4 measured Pages: 7 colours, 1 typeface and 2 corner radii. Not every Page uses all of them.
- Colours
- 7coloursBackground, Text, Muted and 2 more
- Typefaces
- 1typefaceGeistSans
- Base unit
- 8pxbase unit4 of 4 paddings on it
- Corner radii
- 2radiiPill · 4px
01 · Colour
Colour
Named by the job each colour does
The page behind everything
4/4 PagesMost of the text
4/4 PagesSecondary text
4/4 PagesButtons and links
2/4 PagesBands and cards on the page
2/4 PagesBands and cards on the page
1/4 PagesButtons and links
1/4 Pages
Contrast
Text on background 17.1 : 1 · AAA
Text on surface 15 : 1 · AAA
Accent on background 4.3 : 1 · large text only
02 · Type
Type
Drawn in the Site's fonts if your browser has them
Headings
GeistSans
Vercel
4/4 Pages
03 · Spacing
Spacing
Measured as drawn on the desktop Capture
Section padding
8px base · 4 of 4 on the grid
- 40px1/4 Pages
- 120px1/4 Pages
- 48px1/4 Pages
- 24px1/4 Pages
The typical space at the top of a Section, one value per Page.
04 · Radius
Radius
The corner most buttons, fields and cards share
Pill 2/4 Pages
4px 1/4 Pages
05 · Export
Export
Take the system with you
/* Design tokens from Vercel (https://vercel.com), https://designly.sh/style-sheets/vercel, via Designly. Credit the business if you use them. */
:root {
--color-background: #FAFAFA;
--color-text: #171717;
--color-muted: #4D4D4D;
--color-accent: #0070F3;
--color-surface: #EBEBEB;
--color-surface-2: #666666;
--color-accent-2: #E93D82;
--font-display: "GeistSans", sans-serif;
--radius: 9999px;
--spacing: 8px;
--spacing-section: 40px;
}
Values only: Designly never copies a Site's font files or images. Fonts are named so you can license them.