Linear
Linear's brand palette — a dark-first minimal identity built around a desaturated indigo-violet primary (#5E6AD2), Mercury White for light surfaces (#F4F5F8), and Nordic Gray for dark surfaces (#222326). The palette is deliberately restrained: one accent, two canvases, and a tight set of authored neutrals to support a near-monochrome product surface where typography, spacing, and motion carry the brand voice.
17 swatches 14 light roles 14 dark roles
Swatches
linear-indigo
#5E6AD2
Signature desaturated indigo-violet. Primary brand accent — used on the wordmark, primary buttons, and key interactive surfaces.
mercury-white
#F4F5F8
Light-mode canvas — a cool off-white documented in Linear's brand guide.
nordic-gray
#222326
Dark-mode canvas — the canonical product surface for Linear's dark-first identity.
linear-near-black
#08090A
Authored deepest canvas — used below Nordic Gray for the most-recessed surfaces.
linear-surface-dark
#1A1B1F
Authored elevated surface on dark mode.
linear-surface-elevated-dark
#2C2D31
Authored modal / popover surface on dark mode.
linear-text-on-dark
#F7F8F8
Primary text on Nordic Gray.
linear-text-secondary-dark
#B4BCD0
Secondary text on dark canvas.
linear-text-tertiary-dark
#8A8F98
Tertiary / muted text on dark canvas.
linear-text-on-light
#0B0C10
Primary text on Mercury White.
linear-text-secondary-light
#3F4350
Secondary text on Mercury White.
linear-text-tertiary-light
#6B7280
Tertiary / muted text on Mercury White.
linear-surface-light-elevated
#FFFFFF
Authored elevated surface for light mode.
linear-indigo-hover
#7A87F0
Authored softer indigo for hover / active states.
linear-success
#4CB782
Authored success / completed accent.
linear-warning
#F2C94C
Authored warning accent.
linear-error
#E5484D
Authored error accent.
Mode role mappings
Light mode (14 roles)
accent
→ linear-indigo accent-hover
→ linear-indigo-hover background
→ mercury-white error
→ linear-error primary
→ linear-indigo primary-hover
→ linear-indigo-hover success
→ linear-success surface
→ linear-surface-light-elevated surface-elevated
→ linear-surface-light-elevated text-primary
→ linear-text-on-light text-secondary
→ linear-text-secondary-light text-tertiary
→ linear-text-tertiary-light warning
→ linear-warning warning-hover
→ linear-warning Dark mode (14 roles)
accent
→ linear-indigo accent-hover
→ linear-indigo-hover background
→ nordic-gray error
→ linear-error primary
→ linear-indigo primary-hover
→ linear-indigo-hover success
→ linear-success surface
→ linear-surface-dark surface-elevated
→ linear-surface-elevated-dark text-primary
→ linear-text-on-dark text-secondary
→ linear-text-secondary-dark text-tertiary
→ linear-text-tertiary-dark warning
→ linear-warning warning-hover
→ linear-warning Provenance
- Source
- https://linear.app
- License
Proprietary — All Rights Reserved- Attribution
- Linear and the Linear mark are trademarks of Linear Orbit, Inc. The primary brand color (#5E6AD2) is verified via the simple-icons brand database, which cites linear.app as the source. Mercury White (#F4F5F8) and Nordic Gray (#222326) are read directly from Linear's published brand guidelines page (linear.app/brand). Linear's brand guidance describes the primary as "a subtle desaturated blue," consistent with #5E6AD2.
- Imported
-
2026-05-17 - Notes
- Linear is a dark-first brand: Nordic Gray is the canonical product canvas, with Mercury White as the canonical light-mode canvas. Surface elevations and text tints below Mercury White / above Nordic Gray are authored neutral inversions to support both modes consistently — only the three named hex values (Mercury White, Nordic Gray, primary indigo) are direct from Linear's brand documentation.