Design language comparison

Anthropic vs TradingView

Two references, one frame. Palette, typography and the curator verdict for Anthropic and TradingView, read side by side.

Palette & spacing overlap

Palette

Shared (0)

No shared swatches

Anthropic only

#141413#b0aea5#faf9f5#000000#87867f#eda100

TradingView only

#0f0f0f#ffffff#0000ee#707070#9c9c9c#ebebeb#ff9800#cc2f3c#06806b#22ab94#4a4a4a#131722#2e2e2e#f4f1db#b8b8b8

Spacing scale (px)

Shared (9)

2px4px8px12px16px24px28px32px48px

Anthropic only

22px53px59px

TradingView only

6px20px30px

Anthropic

ai · Light

anthropic.com

Palette

#141413: _color-theme---button-tertiary--text-hover
#b0aea5: swatch--cloud-medium
#faf9f5: _color-theme---button-secondary--text-hover
#000000: foreground
#87867f: swatch--cloud-dark

Typography

Anthropic SansAnthropic Serif

TradingView

fintech · saas · Light

www.tradingview.com

Palette

#0f0f0f: color-cold-gray-900
#ffffff: color-white
#0000ee: brand
#707070: color-cold-gray-550
#9c9c9c: color-cold-gray-400

Typography

-apple-system

Typography

Display / body / mono + weight ladder

Side A · Light

Anthropic

Display: Anthropic Sans
Body: Anthropic Serif
Mono: Anthropic Mono

Weight ladder

400500600700

Side B · Light

TradingView

Display: -apple-system
Body: -apple-system

Weight ladder

400500600700

Spacing scale

Base unit + container + first 8 steps

Side A · Light

Anthropic

Base unit: 4 px
Container: 1272 px

2px

4px

8px

12px

16px

22px

24px

28px

Side B · Light

TradingView

Base unit: 4 px
Container: 1000 px

2px

4px

6px

8px

12px

16px

20px

24px

Motion vocabulary

Level + libraries + durations + easings

Side A · Light

Anthropic

Level: moderate
Libraries: GSAP

Durations

0.1s0.2s0.3s0.4s0.8s

Easings

easecubic-bezier(0.16, 1, 0.3...cubic-bezier(0.77, 0, 0.1...ease-in

Side B · Light

TradingView

Level: subtle
Libraries: -

Durations

150ms200ms

Easings

cubic-bezier(0.4, 0, 0.2, 1)