clerk.com

How it works

hero:

Centered headline (2–3 lines, bold serif weight) over subtext and a single purple button, positioned above a 60/40 left-right split showing a phone mockup on the right and feature list on the left.

layout:

Repeating asymmetric pattern of left-aligned text blocks paired with right-aligned imagery or card grids; full-bleed dark sections interrupt the rhythm with 2–3 column layouts of feature cards; section dividers use diagonal cuts rather than straight edges.

type:

Large bold serif for headlines (likely 48–56px), paired with smaller sans-serif body copy; sans-serif numerals and labels in feature cards; consistent linespacing creates vertical breathing room between sections.

colors:

Off-white background alternates with solid black sections; a single purple (#6366F1 range) used exclusively for buttons and link accents, creating stark contrast and visual hierarchy; dark text on light, light text on dark.

distinctive:

Diagonal black-to-white section transitions (top-left to bottom-right cuts) that create a paper-fold effect, making each section feel physically separate while maintaining forward momentum.