Skip to main content

MATTE BLACK COLOR SYSTEM

Sophisticated palette replacing red/green with amber/cyan accents

PRIMARY COLORS

Amber Primary

oklch(0.70 0.15 65)

Use for: Headers, buttons, links, focus states, important highlights

Cyan Accent

oklch(0.75 0.12 195)

Use for: Code syntax, success states, secondary actions, metadata

Coral Warning

oklch(0.60 0.20 30)

Use for: Warnings, errors, destructive actions, alerts

NEUTRAL SCALE

Background

oklch(0.0 0 0)

Card

oklch(0.09 0 0)

Secondary

oklch(0.18 0 0)

Border

oklch(0.25 0 0)

USAGE EXAMPLES

Buttons

Code Syntax

const buildSystem = "brutalist";
function deploy() {
return system.launch();
}

Typography Hierarchy

H1: Primary Headers

H2: Section Headers

H3: Subsection Headers

Body text: Regular content in off-white for comfortable reading

Muted text: Secondary information and metadata

Highlights & Tags

FEATUREDNEWURGENTDEFAULT

COLOR PHILOSOPHY

Amber (#F59E0B) replaces red as the primary accent - warmer, more sophisticated, and less aggressive while maintaining high visibility and energy.

Cyan (#06B6D4) replaces green for code and success states - modern, technical, and easier on the eyes than bright green.

Coral (#F97316) serves as the warning/error color - distinct from both amber and cyan while maintaining warmth.

The matte black foundation (pure black #000000 with charcoal accents) provides maximum contrast and a sleek, professional aesthetic. Off-white text (#FAFAFA) reduces eye strain compared to pure white.