Soundfangled
Colour

Signal yellow leads the system.

Yellow is the primary orientation plane. Black rules, off-white surfaces, red command cues and proof imagery keep it technical, legible and commercially serious.

Primary visual route

Yellow lab

System first

Proof-led

Useful blocks

Warm control

Guidance
Core base#0D0B08

Black

Core base#FFFFFF

White

Section background#FAF8F2

Canvas

Primary accent#FCE155

Signal Yellow

Primary accent#EF3F36

Control Red

Secondary accent#6E4E32

Umber

System state#A9CFA5

Soft Sage

System state#3F7049

Deep Sage

Depth#3A2C28

Roasted Umber

Support#8D7B67

Warm Taupe

Tint#E8DDCE

Soft Oat

Tint#F7F1E8

Cream Tint

Tints create surface hierarchy.

Use warm and technical tints to separate sections, panels and diagrams without turning colour into decoration. White should mostly stay reserved for cards and proof surfaces that need to lift from the page.

#FAF8F2

Canvas

Warm supporting background

Use for secondary editorial sections and quieter long-form pages. It supports yellow lab rather than replacing it as the lead surface.

#EFE8DA

Parchment

Dividers and quiet fills

Use for technical table rows, separators, low-emphasis metadata bands and inactive surfaces.

#F7F1E8

Cream Tint

Subtle warm tint

Use for very quiet section shifts, diagram grounds and hover states. It should read as warmth in the paper, not as a coloured block.

#E8DDCE

Soft Oat

Soft depth tint

Use sparingly for secondary panels and technical annotations that need a little more separation than Cream Tint.

Semantic colour is a signal system.

Use semantic colours when they clarify state, route, severity or meaning. Avoid using them as interchangeable accents, especially across serious technical or conversion surfaces.

#FCE155

Signal

Primary orientation layer

Use for page leads, navigation, selected markers, route emphasis and the clearest next action. Pair it with black rules, off-white surfaces and real proof so it feels like a system, not decoration.

#EF3F36

Command

Urgency and active emphasis

Use for destructive actions, critical notices, active technical states and controlled moments of brand energy.

#A9CFA5

Success

Confirmed or complete

Use when something has passed, completed, connected or been approved. Keep it factual, not celebratory.

#3F7049

Grounded

Acoustics and physical environment

Use for acoustic, environmental, sustainability or room-condition signals where a grounded green meaning is helpful.

#6E4E32

Umber

Technical support state

Use for diagrams, system roles, AV infrastructure and calm information states that need more weight than taupe.