Vercel homepage, decoded: empty space and one dark object

This is iter0's independent analysis of the Vercel homepage as we captured it on 2 Oct 2026, at a 1440px desktop width and a 390px phone width. It is not affiliated with, endorsed by or written with Vercel. Everything below comes from a design spec we already hold for the page: its measurements, its layout and what the capture did and did not show. There are no screenshots, logos or marketing copy from Vercel here, and a live site can change at any time.

The hero is a 1392px by 836px field of near-white. A 64px headline and two pill actions sit at the left, a dark triangular object is centred near the middle, and a compact three-line descriptor sits at the right. A row of customer marks sits low on the page. The composition depends on leaving most of the space empty, so the three items feel placed rather than stacked.

A slim sticky bar, 64px high, balances a small mark at the left and four compact links against three actions on the right. Only one of the three actions is filled dark, which makes it the single obvious step. At the top of the page the header is transparent; by the time the page has scrolled 900px it has a near-white background and a subtle divider.

The signature below the hero is an editorial product panel: a wide two-line heading above a large, pale interface image (921px by 486px) on the left, with a narrow 333px text column to its right, vertically near the middle. The text column holds a short paragraph and a compact list whose rows repeat every 26px. Gaps are 20px across and 4px down, so the image feels anchored rather than boxed.

The typeface is Geist Sans throughout. The hero heading is 64px at weight 400 with strong negative tracking, the section heading is 56px, and the support paragraph is 24px. Colour is a #171717-like dark for text, #4d4d4d for muted copy, white secondary surfaces and one dark filled action. The spec says to add no accent colours.

On a 390px phone the header stays 64px with a 44px menu button replacing the desktop links and actions. The hero changes to a centred stack: the dark object, then a 48px heading, then a descriptor in a monospaced face, then two full-width 40px actions, with customer marks cropped at the bottom right. The right-hand descriptor from desktop is gone.

The spec notes a small 'drop to deploy' element but says the actual drag behaviour and any other animation are unknown, and the exact bounds of the dark object are unmeasured. Anything below the first phone screen is not evidenced.

Place three things on a big quiet canvas and refuse to fill the gaps. Give your header exactly one filled action so the next step is obvious, and let the header gain a background only when the page moves under it.

We keep a longer craft spec for this page: hero, navigation and signature component, with the measured sizes, a list of what not to copy and checks you can run. It is free to download as a Markdown file, and you can use it as a pattern guide for your own site. It describes layout and proportion, so use your own name, wording and imagery. If you want a site built around the same pattern, give the spec to iter0 and it will build you an original page from it.