Dark, round, and violet —
in that order of importance.

The horizontal wordmark is primary

Drawn at 357×110. The chevron is always #5F20FE; the wordmark paths are white, so the default pairing is white-on-near-black. Clear space equals the height of the chevron. The artwork predates Satoshi and is outlined Montserrat Bold — the paths are vector outlines, not live text, and must never be re-typed by hand.

codecave-wide.svg · primary · dark ground

Wordmark variants

One row per lockup, and each row reads the same left to right: vector master, then white text, black text, all-white ink, all-black ink. Black-ink artwork is the brand's only light-surface exception — those tiles carry a light ground because the ink demands it; the rule is declared per variant, never derived from the page.

Wide — primary, 357×110

Tall — stacked, for square and narrow fields

Mark & application icons

Six files, one drawing — that is deliberate. The chevron is the entire icon program; the files differ in padding and raster size, never in artwork, so the legend under each tile is what tells them apart. The mark never carries the wordmark's clear-space rule — an app icon is already a bounded field.

Two of these are literally the same file — the desktop 512 is byte-for-byte the PWA 512 — and favicon.svg is codecave-mark.svg with 30 units of breathing room per side. Every raster keeps a transparent ground; iOS and Android composite their own plate behind it.

Six roles carry the brand

Depth never comes from contrast. The page is #0A0A0B and a card is #0F0F15 — one hair apart. What separates them is the 24px radius and a 1px #2B2848 hairline. Violet is an edge colour: it draws links, borders, eyebrows and the focus halo, and never fills a large area.

The full ramp

Two ramps ship in colors_and_type.css — twelve violet brand steps and thirteen grays, verbatim from the site's 2026 rebuild — plus single-use accents for the glow button, the gradient and the section glow. The six roles above are drawn from them.

Satoshi, two weights

Regular 400 and Bold 700 carry everything. Production declares a single face with no weight descriptor, so live 700 text is browser-synthesized; this package binds the genuine cuts, which will read marginally tighter until production ships the same files. Fallbacks: system-ui, -apple-system, Segoe UI, Helvetica Neue, Arial, sans-serif.

The eyebrow

The system's one typographic signature: a bold violet line over a larger light lead line. It opens nearly every section.

Pill buttons, hairline cards

Every control is a 48px pill: padding: 4px 24px, border-radius: 9999px, 16px bold label. Hover raises contrast everywhere except the tertiary border, which production dims to #4004AF — reproduced faithfully, flagged in WEBSITE-REVIEW.md. Only :disabled reduces the label, to opacity 0.2. Rendered live from colors_and_type.css, so this row is a working check on the token file rather than a picture of one.

The one violet field

One primary action per page. The glow button is #9980FF with #1B0D4E text at 5.67:1, and it is the only place violet fills an area. Three light sources stack: a static halo, a highlight travelling under the fill, and an edge bloom 8px outside each end. The fill never changes colour on hover.

Surfaces

Input & chips

Straight from the contact form. The label lives inside the field (common/InputText.vue), bold at caption size with a violet asterisk, and the placeholder is a full sentence, not a format hint. Nothing pins the 64px height — it is 28px of top padding around one 24px text line plus 12px below. The chips are checkboxes (Checkbox.vue, secondary / small), not tags — they toggle.

Focus is a violet halo — outline: none plus --shadow-input-focus — and the error state swaps the same halo red via --shadow-input-error. Everything else gets a 2px #B19AFE ring. Neither may be removed.

A small senior team, talking straight

First-person plural, present tense, short declaratives. Lead with the business outcome, then name the technology. Risk, cost and ownership are addressed head-on, because reassurance rather than excitement is what the audience is buying.

1. Outcome before technology — every service is titled by what it produces, never by its stack.
2. Risk is named, not hidden — NDA, scope, milestones and outcomes are stated upfront.
3. One low-friction ask — a free consultation, requested through a single primary action per page.
4. Evidence over adjectives — every figure carries a named source; nothing is claimed without one.

Round, asymmetric, lit from below

How a page is built, as opposed to what it is coloured. Every specimen below is drawn with the real token out of colors_and_type.css — a corner rounded at true size, padding at its literal value — rather than a picture of one.

The radius ladder

Radius is the loudest signal in the system, and a 4px corner does not occur anywhere in source. Measured census on the homepage: 24px on 42 blocks, 12px on 9, 44px on 8, 8px on 7, 120px on 2. Radii of 2–4px do not appear at all.

The two section-panel steps — 64px below 768px, 120px at and above it — are missing from this row on purpose. They are sized for a full-width panel and read as a lozenge on a tile this small; they are shown at their real width two blocks down.

Section rhythm is asymmetric

200px of padding above a section, 120px below. Sections own their approach, not their exit — so vertical space never collapses into one shared symmetric gap. Drawn here at true size straight from --section-padding-top and --section-padding-bottom; the hatched bands are the padding.

The light comes from below

A section panel is #0A0A0B — the same value as the page behind it. Nothing separates the two but radius and light thrown upward: --shadow-section stacks three layers with negative Y offsets seeded from #281470. It is physically wrong and instantly recognisable. The stage below is one step lighter so the shoulder is visible; on the real site the glow alone finds the edge.

What the posture forbids

1. Depth never comes from contrast. The page is #0A0A0B and a card is #0F0F15 — one hair apart on purpose. If you are lightening a card to make it read, you have made a layout mistake, not a colour one.
2. Only section panels are lit. Cards, inputs and buttons take no shadow at all — --shadow-section belongs to .section-container and nowhere else. The glow button's halo is a separate token with a separate job.
3. The container is fixed at max-width: 1280px with gutters stepping 8px → 16px → 32px, and 768px is the one structural break in the whole system. Nothing else in the layout gets a second opinion about where to bend.
4. One primary action per page. A long page may repeat the glow button once at the very end, never twice inside a viewport.
5. There is no light theme. The black-ink logo variants in 01 are a bounded exception for print and cannot be generalised into one.