---
source: gallery_stripe
---

# stripe.com — Atmosphere

> Confident financial infrastructure brand in signature indigo-violet, clean sans-serif type, and generous whitespace.

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

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

## Hero

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

> Financial infrastructure to grow your revenue. Accept payments, offer financial services, and implement custom revenue models—from your first transaction to your billionth.

## Color

| Token | Hex | Role | Usage |
|-------|-----|------|-------|
| `#000000` | ![#000000](https://placehold.co/16x16/000000/000000.png) | text | body text |
| `#061b31` | ![#061b31](https://placehold.co/16x16/061b31/061b31.png) | text | h2 text |
| `#533afd` | ![#533afd](https://placehold.co/16x16/533afd/533afd.png) | brand | icon text |
| `#81b81a` | ![#81b81a](https://placehold.co/16x16/81b81a/81b81a.png) | accent | h1 text |
| `#64748d` | ![#64748d](https://placehold.co/16x16/64748d/64748d.png) | text | p text |
| `#000000` | ![#000000](https://placehold.co/16x16/000000/000000.png) | text | button-primary text |
| `#ffffff` | ![#ffffff](https://placehold.co/16x16/ffffff/ffffff.png) | background | a text |
| `#533afd` | ![#533afd](https://placehold.co/16x16/533afd/533afd.png) | brand | a background |
| `#ffffff` | ![#ffffff](https://placehold.co/16x16/ffffff/ffffff.png) | background | section background |

### Backgrounds

- **section** — `#ffffff`

## Typography

**Font families**

- sohne-var
- SF Pro Display
- sans-serif

**Scale**

| Role | Size | Weight | Line height | Family |
|------|------|--------|-------------|--------|
| h1 | `48px` | 300 | `55.2px` | sohne-var |
| body | `16px` | 400 | `normal` | sohne-var |

## Spacing

Scale: `8px` · `10px` · `16px` · `17px` · `24px` · `28px`

## Radius

Scale: `0px` · `4px` · `6px`

## Motion

| Duration | Easing | Property |
|----------|--------|----------|
| `800ms` | `cubic-bezier(0.165, 0.84, 0.44, 1)` | transform |
| `100ms` | `steps(1)` | z-index |
| `300ms` | `cubic-bezier(0.25, 1, 0.5, 1)` | background-color |
| `300ms` | `cubic-bezier(0.25, 1, 0.5, 1)` | color |
| `300ms` | `cubic-bezier(0.25, 1, 0.5, 1)` | outline-color |

## Container widths

- **h1** (unspecified) — `958.642px`
- **button-primary** (unspecified) — `1232px`
- **button-secondary** (unspecified) — `816px`
- **nav** (unspecified) — `1349px`

## Voice

Tone: `confident` · `authoritative` · `clear` · `business-forward`

- *(hero)* "Financial infrastructure to grow your revenue."
- *(hero)* "Accept payments, offer financial services, and implement custom revenue models—from your first transaction to your billionth."
- *(meta-description)* "Stripe is a financial services platform that helps all types of businesses accept payments, build flexible billing models, and manage money movement."
- *(body)* "Flexible solutions for every business model."
- *(body)* "Grow your business with a comprehensive set of payments and financial tools⁠—⁠designed to work individually or together."


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