Linear Color Palette
TechLinear's brand identity combines a dark interface with precise violet-blue accents, reflecting its focus on speed, clarity, and engineering elegance in project management.
linear.appLinear logo is a trademark of Linear. Used for informational purposes.
Brand Colors
Linear Purple
primary
Linear Dark
secondary
Linear Violet
accent
Surfaces & Borders
Linear Background
background
Linear Surface
surface
Linear Border
border
Typography
Linear White
textPrimary
Linear Gray
textSecondary
Linear Muted
textMuted
Semantic Colors
Linear Green
success
Linear Yellow
warning
Linear Red
error
Linear Info
info
Accessibility
textPrimary / background
textPrimary / surface
textSecondary / background
textSecondary / surface
textMuted / background
textMuted / surface
Color Theory
Linear's deep-dark palette with precise purple accents communicates engineering-grade quality. The near-black backgrounds with blue undertones create a focused, distraction-free environment for technical teams.
- Purple-blue (#5E6AD2) provides the sole accent against deep indigo-black surfaces
- Blue-tinted dark backgrounds (#0F0F1A, #1B1B2E) feel warmer than pure black while maintaining focus
- Pastel semantic colors (green, yellow, red) are lightened to work against dark backgrounds
Color Psychology
The dark palette signals precision, focus, and developer sensibility. Purple accents add a creative edge without undermining the professional tone. The overall effect is an IDE-like environment that developers feel at home in.
Evolution
Linear has consistently maintained its dark-first, purple-accented identity since launch. The specific shades have been refined for better accessibility and more nuanced surface layering.
How Linear Uses Color
Primary
Linear Purple (#5E6AD2) marks active states, selected items, and primary CTA buttons throughout the interface.
Secondary
The dark navy-indigo (#171723) serves as the sidebar and elevated panel background.
Accent
Lighter violet (#818CF8) is used for hover states and secondary interactive elements.
Backgrounds
Deep backgrounds with blue undertones (#0F0F1A, #1B1B2E) create layered depth without competing with content.
Typography
High-contrast white text (#F1F1F4) with two muted gray tones creates clear hierarchy on dark surfaces.
Semantic
Pastel semantic colors (green, yellow, red) are calibrated for dark background legibility rather than matching typical light-mode values.
Agent integration
Use Linear's Colors in Your Agent
Terminal
Copies full install command. Saves skill to .claude/skills/linear/ — auto-detected on next run.
Included in the skill file
- 113 color roles — hex, HSL, and CSS variable names
- 2WCAG contrast rules for accessible pairings
- 3Auto-applies Linear's palette when generating UI
Frequently Asked Questions
Create Something Inspired by Linear
Generate a unique color palette inspired by Linear's aesthetic using AI.