Skip to main content

Design language comparison

Linear vs Raycast

Both Linear and Raycast commit to a dark-canvas approach, and they pair different display families (Inter Variable vs Inter). Beyond surface, motion levels are both expressive.

Palette · side by side

Up to 8 dominant swatches each

Side A · dark

Linear

Full Page

#f7f8f8

background

#62666d

foreground

#d0d6e0

foreground

#8a8f98

foreground

#f79ce0

accent

#55cdff

accent

#ffc47c

accent

#00ff05

accent

Side B · dark

Raycast

Full Page

#ffffff

background

#000000

foreground

#434345

foreground

#6a6b6c

foreground

#9c9c9d

foreground

#e6e6e6

background

#02193b

accent

#2f3031

foreground

Typography · side by side

Primary family + weight ladder + sample

Side A · dark

Linear

Full Page

Display
Inter Variable
Body
Berkeley Mono
Mono
Berkeley Mono
Weights
400 · 510 · 590

Sample

The quick brown fox jumps over the lazy dog.

1234567890 — Body sample renders in the captured family if your browser has it; otherwise system fallback signals the weight ladder.

Side B · dark

Raycast

Full Page

Display
Inter
Body
SF Pro Text
Weights
400 · 500 · 600

Sample

The quick brown fox jumps over the lazy dog.

1234567890 — Body sample renders in the captured family if your browser has it; otherwise system fallback signals the weight ladder.

Spacing scale · side by side

Base unit + first 8 scale values

Side A · dark

Linear

Full Page

Base unit
4 px
Container max
1436 px
2px
4px
6px
8px
10px
12px
14px
16px

Side B · dark

Raycast

Full Page

Base unit
4 px
Container max
1204 px
2px
4px
6px
8px
10px
12px
15px
20px

Motion vocabulary · side by side

Level + durations + easings

Side A · dark

Linear

Full Page

Level
expressive
Libraries

Durations

0.16s0.4s1.6s2.8s3.2s

Easings

cubic-bezier(0.25, 0.46, …cubic-bezier(0.66, 0, 0, 1)ease-outease

Side B · dark

Raycast

Full Page

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

Palette & spacing overlap

Their palettes share 5% of swatches at the dominant tier — a quiet signal both teams drew from the same neutral library before applying brand accents. Their spacing scales overlap by 67% (2, 4, 6, 8, 10 px shared) — a rhythm any agent can transfer between the two systems with minimal recalibration.

Shared swatches (1)

#000000

Curator verdict

If you are building an interface that needs to reference both, Linear's restraint reads as the safer default and Raycast's rhythm provides the accent moments — pair them at section-level, not at component-level.

Full Linear brief →Full Raycast brief →Back to gallery

AI2 Design counts anonymous traffic always — no cookies, no identifiers, no fingerprinting. For optional session insights (PostHog, EU region) — page funnel, performance — turn on opt-in analytics below. Cookie policy.