Design language comparison

Anthropic vs Raycast

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

Palette & spacing overlap

Palette

Shared (1)

#000000

Anthropic only

#141413#b0aea5#faf9f5#87867f#eda100

Raycast only

#ffffff#434345#6a6b6c#9c9c9d#e6e6e6#02193b#2f3031#63a1ff#ff6363#2e6fcf#1b1c1e#452324#9ebed7#59d499#d72a2a

Spacing scale (px)

Shared (7)

2px4px8px12px22px24px32px

Anthropic only

16px28px48px53px59px

Raycast only

6px10px15px20px29px

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

Raycast

productivity · developer tools · saas · Dark

raycast.com

Palette

#ffffff: reverse-background
#000000: Base-Black
#434345: grey-400
#6a6b6c: grey-300
#9c9c9d: grey-200

Typography

InterSF Pro TextGeometric sans

Typography

Display / body / mono + weight ladder

Side A · Light

Anthropic

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

Weight ladder

400500600700

Side B · Dark

Raycast

Display: Inter
Body: SF Pro Text

Weight ladder

400500600

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 · Dark

Raycast

Base unit: 4 px
Container: 1204 px

2px

4px

6px

8px

10px

12px

15px

20px

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 · Dark

Raycast

Level: expressive
Libraries: -

Durations

0.2s0.3s0.4s0.7s1.5s

Easings

cubic-bezier(0.23, 1, 0.3...cubic-bezier(0.215, 0.61,...cubic-bezier(0.165, 0.84,...ease