---
source: gallery_clerk
---

# clerk.com — Atmosphere

> Developer-focused auth platform with a signature violet accent, crisp near-black text, and clean airy neutrals.

> Extracted by [Coherent](https://getcoherent.design) from `https://clerk.com` on 2026-07-20 03:02:30 UTC.
> Mode: `light` · captured in 4846ms · density: `comfortable`

<!-- coherent-extract: v1 -->

## Hero

**Detected via:** `h1` (64px)

> More than authentication, Complete User Management

## Color

| Token | Hex | Role | Usage |
|-------|-----|------|-------|
| `#000000` | ![#000000](https://placehold.co/16x16/000000/000000.png) | text | body text |
| `#131316` | ![#131316](https://placehold.co/16x16/131316/131316.png) | text | h1 text |
| `#747686` | ![#747686](https://placehold.co/16x16/747686/747686.png) | text | button-secondary text |
| `#6c47ff` | ![#6c47ff](https://placehold.co/16x16/6c47ff/6c47ff.png) | brand | h2 text |
| `#5e5f6e` | ![#5e5f6e](https://placehold.co/16x16/5e5f6e/5e5f6e.png) | text | p text |
| `#f7f7f8` | ![#f7f7f8](https://placehold.co/16x16/f7f7f8/f7f7f8.png) | background | body background |
| `#131316` | ![#131316](https://placehold.co/16x16/131316/131316.png) | text | a background |
| `#747686` | ![#747686](https://placehold.co/16x16/747686/747686.png) | text | button-primary text |
| `#ffffff` | ![#ffffff](https://placehold.co/16x16/ffffff/ffffff.png) | text | a text |

### Backgrounds

- **page** — `#f7f7f8`

## Typography

**Font families**

- geistNumbers
- suisse
- suisse Fallback
- soehneMono
- ui-monospace
- SFMono-Regular

**Scale**

| Role | Size | Weight | Line height | Family |
|------|------|--------|-------------|--------|
| h1 | `64px` | 700 | `72px` | geistNumbers |
| body | `16px` | 400 | `24px` | geistNumbers |

## Spacing

Scale: `8px` · `12px` · `16px` · `48px` · `128px` · `160px` · `272px`

## Radius

Scale: `0px`

## Motion

| Duration | Easing | Property |
|----------|--------|----------|
| `200ms` | `cubic-bezier(0, 0, 0.2, 1)` | padding |

## Container widths

- **h1** (unspecified) — `896px`
- **p** (prose) — `672px`

## Z-index scale

- **z-10** — `10`
- **z-50** — `50`

## Voice

Tone: `confident` · `developer-centric` · `efficient` · `modern`

- *(hero)* "More than authentication, Complete User Management"
- *(meta-description)* "The easiest way to add authentication and user management to your application. Purpose-built for React, Next.js, Remix, and "The Modern Web"."
- *(body)* "Need more than sign-in? Clerk gives you full stack auth and user management — so you can launch faster, scale easier, and stay focused on building your business."


---
Captured deterministically from computed CSS. Numerical fields (color, motion, spacing) reflect the live site at extraction time.
