Design System
Inspired by
Wise

A design token catalog generated from DESIGN.md. Every color, font, and component — bold, green, and borderless.

Send Money Learn More
01 / Colors

Color Palette

Brand
Near Black
#0e0f0c
Primary text
Wise Green
#9fe870
Primary CTA
Dark Green
#163300
Button text on green
Mint
#e2f6d5
Soft green surface
Semantic
Positive
#054d28
Success
Danger
#d03238
Error
Warning
#ffd11a
Warning
Orange
#ffc091
Warm accent
Neutral
Warm Dark
#454745
Secondary text
Gray
#868685
Muted text
Light
#e8ebe6
Light surface
02 / Typography

Typography Scale

DISPLAY HERO
Display — 126px / 900 / 0.85 / Wise Sans / "calt"
Section Title
Section — 40px / 900 / 0.85 / Wise Sans
Card Title
Card — 22px / 600 / 1.25 / -0.396px / Inter
Body — Send money abroad. Fast, cheap, transparent. No hidden fees, no bad exchange rates.
Body — 18px / 400 / 1.44 / +0.18px / Inter
Body Semibold — Account balance
Semibold — 18px / 600 / 1.44 / -0.108px / Inter
Caption — Updated 2 minutes ago
Caption — 14px / 600 / 1.55 / -0.084px / Inter
03 / Buttons

Buttons

Send Money
Primary Green
Learn More
Subtle

Hover to see scale(1.05) grow. Click for scale(0.95) compress.

04 / Cards

Cards

International Transfers

Send money to 80+ countries at the real exchange rate. No markup, just a small, transparent fee.

Multi-currency Account

Hold and convert 40+ currencies. Spend abroad with the Wise card. Green accent card variant.

Business Account

Pay invoices, receive payments, and manage your international finances in one place.

05 / Forms

Forms

Default
Focus (green ring)
Error
06 / Spacing

Spacing

4
8
12
16
20
24
07 / Radius

Radius

10px
16px
30px
40px
pill
08 / Elevation

Depth

Flat
No shadow
Ring
1px ring shadow