Clerk homepage, decoded: faint art, a dark gallery below

This is iter0's independent analysis of the Clerk 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 Clerk. 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 Clerk here, and a live site can change at any time.

Near-white canvas, near-black 64px headline at weight 700, and an unusually pale, low-contrast collage of product screens behind it. The artwork is placed in two layers about 969px by 887px, but is kept so faint that it never competes. A small label and a compact, outlined action in a monospaced face sit under the paragraph, which gives the call to action the feel of a command rather than a button. The spec says not to swap in a dark hero.

A single compact bar, 42px high, with the identity at the left and the primary navigation placed right next to it, then account actions at the far right. It starts at y=48 just below a 40px announcement strip and sticks at y=8 once you scroll. Over the dark section lower on the page, the labels switch to a light colour while the geometry stays the same.

The signature is a dark product-feature gallery: a centred introduction (a violet eyebrow, a 32px heading, a paragraph and a link) above a field of charcoal cards, about 280px wide, in three columns, with a lower panel spanning two columns beside a single-column one. Each card pairs a 13px heading and 13px description with a muted interface illustration.

A neutral sans: 64px with 72px line height and -1.6px tracking for the hero, 18px for the paragraph, 13px labels. The gallery uses a 32px heading with weight 600. Colour is near-white and near-black on the hero with muted grey body, then near-black, charcoal and white for the gallery with a restrained violet accent.

At 390px the announcement stays 40px and the nav sits at y=48 to 90. The heading is 32px on four lines, centred, and the supporting copy and action follow. Desktop links are replaced by a compact menu control, but account actions remain visible. Trust marks arrange themselves in two columns.

Shadows and opacity on the header are not asserted by the spec, and exact card fill and border values for the gallery are not supplied.

Make background art so faint that the headline always wins, then change the whole mood with a dark section lower down. Use a monospaced style for a developer product's call to action.

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.