BTC $71,234.21 +2.34%
ETH $3,891.45 +1.12%
BNB $642.80 -0.87%
SOL $182.33 +5.61%

Color Palette

Binance Yellow is the singular accent in a monochrome system — gold for action, grey for data, dark for depth.

Primary & Brand

Binance Yellow
#F0B90B
Primary CTA, brand accent
Binance Gold
#FFD000
Pill buttons, secondary CTA
Light Gold
#F8D12F
Gradient endpoint, hover
Active Yellow
#D0980B
Pressed/active state

Surface & Background

Pure White
#FFFFFF
Primary canvas, cards
Snow
#F5F5F5
Input bg, alternating rows
Binance Dark
#222126
Dark sections, footer
Dark Card
#2B2F36
Cards on dark bg

Neutrals & Text

Ink
#1E2026
Primary text, headings
Secondary Text
#32313A
Nav links, body copy
Slate
#848E9C
Metadata, descriptions
Steel
#686A6C
Disabled, subtle labels
Border Light
#E6E8EA
Card borders, dividers

Semantic

Crypto Green
#0ECB81
Positive, up, success
Crypto Red
#F6465D
Negative, down, error
Focus Blue
#1EAEDB
Focus ring, a11y state

Typography Scale

BinancePlex custom typeface (IBM Plex Sans as web substitute) — tabular numerals, 500-700 weights for financial authority.

Display Hero — 60px / 700 / 1.08
Buy, sell & trade crypto
Heading 1 — 34px / 700 / 1.00
Trusted by millions
Heading 2 — 28px / 500 / 1.00
Take your crypto journey further
Heading 3 — 24px / 700 / 1.00
Advanced Trading
Heading 4 — 20px / 600 / 1.25
Feature Card Title
Body Large — 20px / 500 / 1.50
The most trusted US-based crypto exchange with institutional-grade security.
Body — 16px / 500 / 1.50
Standard body text used throughout the platform for product descriptions and educational content.
Body SemiBold — 16px / 600 / 1.30
Navigation links and emphasized text
Caption — 14px / 500 / 1.43
$71,234.21 +2.34% | Last updated 2 min ago
Small — 12px / 600 / 1.00
BADGE LABEL
Tiny — 11px / 500 / 1.00
Chart annotation, micro-label

Button Variants

Pill buttons (50px radius) for CTAs, standard buttons (6px radius) for form actions. Yellow drives all primary actions.

Standard Buttons (6px radius)
Pill Buttons (50px radius)
On Dark Background

Cards & Containers

12px radius, 5% opacity shadow — barely visible elevation that builds trust through subtle depth.

Light Cards
$

Low Fees

Trade with competitive fees starting at 0.1% for makers and takers.

S

Security First

Institutional-grade security with SOC 2 compliance and cold storage.

24

24/7 Support

Round-the-clock customer service with real human agents.

Dark Cards
T

Trade

Access 150+ cryptocurrencies with advanced charting tools.

S

Stake

Earn rewards on your holdings with flexible staking options.

P

Portfolio

Track your holdings in real-time with detailed analytics.


Form Elements

Clean inputs with #E6E8EA borders, 8px radius for standard fields, 50px for search pills.

Please enter a valid email address

Spacing Scale

8px base unit system with progressive scaling for financial UI density.

4
8
12
16
20
25
32
48
64

Border Radius Scale

From tight data cards to full pill buttons — radius communicates interaction level.

2px
Micro
6px
Buttons
8px
Inputs
10px
Tags
12px
Cards
24px
Video
50px
Pill CTA

Depth & Elevation

Whisper-light shadows at 5% opacity — trust through clarity, not drama.

Flat
Border only, no shadow
Subtle
5% opacity, resting cards
Medium
5% spread, hovered cards
Pill
Visible shadow, floating CTAs