Stripe

Stripe's brand palette as observed on the live marketing site (stripe.com) and the Stripe Press / newsroom surfaces. Anchored on the signature Stripe Purple (#635BFF) against a deep-navy "Slate" text color and a near-white page canvas with subtle fog-blue tints. The palette is light-first; dark surfaces are used sparingly for headers and high-contrast modules. Functional accents (success-green, orange, magenta, pink) appear in Stripe's gradient surfaces and product illustrations and are preserved here as a documented secondary scale.

17 swatches 15 light roles 15 dark roles stripepaymentsfintechbrandpurplelight-first

Swatches

stripe-purple
#635BFF
The signature brand color. Primary buttons, links, gradient anchors.
stripe-purple-pressed
#533AFD
Active / pressed state of the primary purple.
stripe-purple-soft
#E8E9FF
Tinted backgrounds, badges, on-brand call-out cards.
stripe-slate-100
#061B31
Deepest slate — large headings on light surfaces.
stripe-slate-90
#0A2540
Standard heading slate, dark module backgrounds.
stripe-slate-70
#3C4F69
Secondary heading / large body text.
stripe-slate-50
#425466
Default body-text gray-blue.
stripe-slate-30
#667691
Muted text and tertiary labels.
stripe-white
#FFFFFF
Pure white surface.
stripe-fog-0
#F6F9FC
Page canvas — the off-white Stripe uses behind content.
stripe-fog-1
#E5EDF5
Subtle dividers and elevated-surface tints.
stripe-fog-2
#CFD7DF
Border / hairline.
stripe-green
#2CA25E
Success / confirmation green.
stripe-orange
#E17A38
Warm accent used in gradient surfaces.
stripe-magenta
#F44BCC
Hot accent — appears in Stripe's brand gradients.
stripe-pink
#FF5996
Light pink accent used in illustration.
stripe-red
#EA2261
Error / destructive action.

Mode role mappings

Light mode (15 roles)

accent → stripe-purple
accent-hover → stripe-purple-pressed
background → stripe-fog-0
border → stripe-fog-2
error → stripe-red
primary → stripe-purple
primary-hover → stripe-purple-pressed
success → stripe-green
surface → stripe-white
surface-elevated → stripe-white
text-primary → stripe-slate-90
text-secondary → stripe-slate-50
text-tertiary → stripe-slate-30
warning → stripe-orange
warning-hover → stripe-orange

Dark mode (15 roles)

accent → stripe-purple
accent-hover → stripe-purple-soft
background → stripe-slate-100
border → stripe-slate-70
error → stripe-pink
primary → stripe-purple
primary-hover → stripe-purple-soft
success → stripe-green
surface → stripe-slate-90
surface-elevated → stripe-slate-70
text-primary → stripe-white
text-secondary → stripe-fog-1
text-tertiary → stripe-slate-30
warning → stripe-orange
warning-hover → stripe-orange

Provenance

Source
https://stripe.com/
License
Proprietary — All Rights Reserved
Attribution
Stripe, Inc. — palette values captured from the deployed stylesheets at stripe.com (computed and source-mapped color declarations on the homepage and brand surfaces). Trademarks, logos, and brand elements are subject to Stripe's Marks Usage Agreement at stripe.com/marks/legal.
Imported
2026-05-17
Notes
Hex values cross-checked between (a) the rendered computed styles of hero headings and CTAs on stripe.com and (b) the color literals present in the deployed marketing stylesheet. #635BFF (Stripe Purple) is the canonical brand purple cited widely in third-party brand databases; #0A2540 and #061B31 are Stripe's documented Slate heading hues; #F6F9FC is the canonical page-canvas off-white.