Light interfaceMeasured vercel.com

Vercel

A sharp, engineer-focused brand that feels minimal, fast, and serious.

This page is styled with Vercel’s own measured values. It is a private reference for AltLeads; their logo, brand and company-only fonts belong to them.

Colours

Each role is a value read from their live website, checked against their screenshots.

Background#FFFFFF
Page behind everything

Surface#FAFAFA
Cards, panels, menus

Text#171717
Headings and body

Muted text#4D4D4D
Secondary info

Line#F9F9F9
Dividers and outlines

Accent#171717
Main button, links, selection

On accent#FFFFFF
Text on the accent

Contrast

Text on background 17.9:1Muted on background 8.5:1Text on accent 17.9:1

Every colour found on their site

#171717#4D4D4D#FFFFFF#0072F5#FAFAFA#F9F9F9

Typography

Headings use GeistSans (free). Body text uses GeistSans (free).

h1	GeistSans · 64px · 400 · -3.84px	Agentic Infrastructure
h2	GeistSans · 56px · 450 · -3.36px	Build agents on infrastructure that thinks like them
p	GeistSans · 14px · 400	Ship 26 is coming to SF
li	GeistSans · 14px · 400	Features

Corners & shadows

Corner sizes used

6px

pill

8px

Shadows

Shadow 1

Shadow 2

Shadow 3

Components, rebuilt from their values

Live and clickable. Built by us from the numbers above, not copied from their code. Sample CRM data.

Buttons

Navigation

WorkspaceCompanies Contacts Meetings

Disposition

InterestedCallbackBengaluru

Hide do-not-call

Next call

Licious · Admin head

Wants a proposal before the cafeteria contract renews in March.

Tabs

Table

Company	Owner	Status	Last touch
Zomato Food tech · Gurugram	PR	Callback	18 days ago
Licious Food tech · Bengaluru	RM	Interested	Today
Delhivery Logistics · Gurugram	AS	No answer	35 days ago

Toast

Call logged · callback on Friday

Real components from their site

Cropped from Vercel’s live website. Click to enlarge.

Buttons · 4

Vercel button: Get a Demo — #FFFFFF · corners 6px · 32px

Vercel button: Deploy now — #171717 · corners 3.35544e+07px · 40px

Vercel button: Talk to sales — #FFFFFF · corners 3.35544e+07px · 40px

Navigation bar · 1

Vercel Navigation bar: Products — no fill · square · GeistSans 16px

Buttons · 4

Vercel Buttons: Get a Demo — fill #FFFFFF · corners 6px · GeistSans 14px

Vercel Buttons: Deploy now — fill #171717 · corners 3.35544e+07px · GeistSans 16px

Vercel Buttons: Talk to sales — fill #FFFFFF · corners 3.35544e+07px · GeistSans 16px

Lists and tables · 2

Vercel Lists and tables: Features — no fill · square · GeistSans 14px

Icons

9 icons copied exactly from their site’s code.

Product screens

10 real screens from web image search, each linked to where it was found.

Vercel product screen: 1200 × 748 — 1200 × 748

Vercel product screen: 1920 × 1234 — 1920 × 1234

Vercel product screen: 1768 × 1205 — 1768 × 1205

Vercel product screen: 2048 × 1277 — 2048 × 1277

Vercel product screen: 1200 × 495 — 1200 × 495

Vercel product screen: 2048 × 1473 — 2048 × 1473

Vercel product screen: 1883 × 935 — 1883 × 935

Vercel product screen: 1080 × 605 — 1080 × 605

Vercel product screen: 460 × 260 — 460 × 260

Do & don’t

What makes it Vercel

Near-black and white only, almost no colour anywhere
Tight letter-spacing on big geometric sans headlines
Pill-shaped black buttons next to plain white outline buttons

Keep the palette to black, white, and light grey
Use a single bold geometric sans font everywhere
Make the primary action a solid black pill button

Don’t

Don't introduce bright accent colours
Don't use soft or rounded display fonts
Don't add decorative shadows or gradients

For AltLeads: Borrow the black-on-white minimalism for a 'developer mode' dashboard view that feels fast and no-frills.

Copy the tokens

Paste into any project to try this look.

/* Vercel · values measured from https://vercel.com/ · reference only, their brand belongs to them */
:root {
  --bg: #FFFFFF;
  --surface: #FAFAFA;
  --text: #171717;
  --muted: #4D4D4D;
  --line: #F9F9F9;
  --accent: #171717;
  --on-accent: #FFFFFF;
  --radius-button: 6px;
  --radius-card: 6px;
  --radius-small: 6px;
  --button-height: 32px;
  --font-heading: "GeistSans", "Geist", system-ui, sans-serif;
  --font-body: "GeistSans", "Geist", system-ui, sans-serif;
  --shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgb(235, 235, 235) 0px 0;
}