Warp

Warp

GPU-accelerated terminal

A modern, GPU-accelerated terminal that replaces a scrolling buffer with block-based command history.

warp.dev

Color palette

Accent

Primary#f7f5f0

Primary brand color — key actions and emphasis.

Mute#aea69c

Accent color used within the product's own UI.

Neutral

On Primary#2b2622

Text and icon color on a solid primary fill.

Ink#f7f5f0

Primary text color.

Body#c9c0ad

Secondary or muted text.

Body Strong#dad2c1

Primary text color.

Canvas#2b2622

Page background.

Canvas Soft#383330

Page background.

Hairline#3f3a36

Borders and dividers.

Type scale

Display Xl
64px · 400 · 1.1
Display Lg
48px · 400 · 1.1
Display Serif
48px · 400 · 1.08
Display Md
32px · 500 · 1.25
Display Sm
24px · 500 · 1.33
Body Lg
18px · 400 · 1.56
Body Md
16px · 400 · 1.5
Body Md Strong
16px · 500 · 1.5
Body Sm
14px · 400 · 1.43
Body Sm Strong
14px · 500 · 1.43
Code Md
14px · 400 · 1.43
Button Md
14px · 500 · 1.43
Code
13px · 400 · 1.38
Caption
12px · 400 · 1.33

Fonts

PrimaryInterWeights 400, 500Fallback: system-ui, -apple-system, Segoe UI, Roboto
CodeDM MonoWeights 400Fallback: ui-monospace, SFMono-Regular, Menlo, monospace
SecondaryInstrument SerifWeights 400Fallback: Georgia, Times New Roman, serif

Spacing & shape

Xxs
2px
Xs
4px
Sm
8px
Md
10px
Lg
16px
Xl
24px
2xl
32px
3xl
48px
4xl
64px
5xl
96px
None
0px
Xxs
1px
Xs
2px
Sm
3px
Md
4px
Lg
6px
Pill
9999px

Guidelines

  • Reserve Primary for primary actions and emphasis — it is the system's one accent color.
  • Keep type on the documented family set (Inter, DM Mono, Instrument Serif).
  • Use one of the documented corner radii (0px, 1px, 2px, 3px, 4px, 6px, 9999px) rather than a one-off value.
  • Build spacing from the documented scale (2px, 4px, 8px, 10px, 16px, 24px, 32px, 48px, 64px, 96px) instead of arbitrary padding.
  • Don't apply Primary as a full-page background or a large fill.
  • Don't introduce a second accent color alongside Primary.
  • Don't mix in an additional typeface beyond the ones documented here.