For agents

Paste this into the session that's building the UI. Do not retype token values from memory — link or vendor the stylesheet.

Build this UI in the Lucian Labs "Console" look.
Read https://lucianlabs.ca/branding/AGENT.md and
https://lucianlabs.ca/branding/console.md before writing any CSS.
Link https://lucianlabs.ca/branding/console.css and use its tokens
and components. Every colour must be a var(--token) from that file.
Follow the ban list in AGENT.md — check your output against it before
you report the work done.

Use it for

yes

Audio tools, dashboards, dev tools, monitors, editors, log viewers. Anything with live state or numbers that move. If a window stays open for an hour, this is the look.

no

Anything a guest touches once — events, menus, checkout, kiosks. That is House Pour. Never blend the two in one product.

Palette

--bg

#101014

--bg-deep

#07080d

--panel-solid

#111420

--line

#383c4a

--ink

#eaecf2

--muted

#aaafbd

--faint

#6b7185

--accent

#397fd9

--accent-2

#ffa40a

--good

#4db378

--bad

#e6404d

--radius

0 — everywhere

The three rules

Zero radius, everywhere. Set on the universal selector. Never overridden for a "special" element. Square corners are the signature.
Depth is hairlines, not shadows. There is no box-shadow in this look. Separation is 1px --line plus the translucent panel over the page wash.
The pixel face carries the chrome. Micro 5 sets headings, buttons, labels, table headers, badges. Body is system sans. Numbers are Inconsolata, tabular. Three faces, three jobs.

Type ramp

Heading 01

Heading 02

Heading 03

label / overline

Body copy is system sans at 1rem, 1.55 line-height. It carries paragraphs and descriptions — never headings, never chrome.

Small copy, muted, 0.9rem.

48000 Hz · -6.2 dB · 128 BPM · 03:41.220

Micro 5 is a pixel face — never set it below 1rem. If text must be smaller than that, it is body or mono, not display.

Buttons — one primary, amber means armed

Amber is state, not decoration — armed, recording, live, or about-to-be-irreversible. If nothing is in that state, amber does not appear on the page.

Panels & state

idle

Hairline border, translucent panel, no shadow. The default surface.

armed

A 2px accent edge on the left. State lives on the boundary, not in a fill.

live

Amber edge. Reserved for capture in progress or irreversible-and-running.

Form & status

input device tempo

idle synced dropped take 04

take	len	peak
01	00:42	-3.1
02	01:18	-6.4
03	00:09	-0.8

Voice

write

record
export wav
no takes yet
device busy — check input 2
48 kHz · -6.2 dB

never

Start Recording Now
Export Your Audio
You haven't created anything yet!
Oops! Something went wrong.
Seamlessly powerful