Colour

7 semantic roles · measured

Dark appearance is the default. Brand colours are accents. General interface surfaces stay grey. Green is reserved for success.

Semantic roles

Canvas
background#0b0e13Page canvas (--canvas)
Surface
surface#172234Cards / specimens (--surface)
Ink
foreground#f0f2f7Body text and headings (--ink)
Muted
muted#a5b1c5Secondary text, captions (--muted)
Line
border#2b3444Hairlines, dividers (--line)
AMMO blue
accent#3097efFilled buttons, active nav (--primary-fill)
AMMO red
accent-secondary#ef3340Destructive actions (--danger-action-fill)

Brand colours as accents

AMMO blue #3097ef
AMMO purple #6434b9
AMMO red #ef3340

The 3px tri-colour rule is the signature device — equal thirds, left to right. It is the only place purple appears.

State pairs — colour never travels alone

Success · saved Danger · destructive Warning Info Disabled

Focus

Focus is a visible ring on every focusable element and is never removed. Dark appearance uses #82bfff; light appearance uses #167bc9.