Brand
One system, every surface.
Website, social, email, decks and one-pagers all read from a single token file. This page is generated from that same file — if a value changes here, it changed everywhere.
tokens.json v2.0.0 · updated 2026-09-07
The line
Production prints the product. We manufacture the revenue.
Commerce infrastructure for fulfillment partners.
Logo
Six lockups, one mark.
The mark is a nested triangle — a pyramid that scales inward — standing in for the A in the wordmark. Vector masters live in the repo; use those for anything above screen size.
Unsettled: the wordmark casing — Brandfora or
BrandFora — is not yet fixed. Prose here uses Brandfora;
the decision applies to the lockup, every footer and the favicon.
Colour
Neutral carries. The accent points.
One primary button per viewport. Chips rotate blue → green → violet → amber and never repeat within a row of four.
Accent
#1849D6 base Brandfora Blue. THE accent: the primary button, links, the active chip, the H1 accent word. #123AAE deep hover/pressed on light #6B8CFF onDark accent text, links and chips on dark grounds #8FA8FF glow hover on dark grounds #E8EEFF wash 10% tint: hover backgrounds, selected chips, the calculator well. Never for text. #C7D4FA washDeep the tint's border rgba(107,140,255,0.16) washOnDark the wash on dark grounds rgba(107,140,255,0.30) washDeepOnDark the wash border on dark grounds #FFFFFF contrast text on a filled accent surface Light
#FFFFFFgroundpage background#F2F4F8surfacecanvas — alternating sections, wells, the app frame ground#EAEEF5surfaceMutedtable stripes, inputs, muted wells#0A1024bandink — dark argument sections, the closing CTA, the footer#141B33bandTintink-2 — cards and lifted surfaces inside a dark section#070B1AbandDeepthe deepest ground; footer bottom#0A1024inkheadlines and body copy#141B33inkSoftsecondary headlines, nav#3B4560text2supporting copy#6B7590text3muted — captions, meta, mono labels#DDE2ECborderhairlines, card borders#C4CBD9borderStrongemphasised dividers, input borders, ghost buttons#F2F4F8onBandtext on a dark section#9AA3BDonBandText2secondary text on a dark sectionrgba(255,255,255,0.12)onBandBorderhairlines on a dark sectionDark
#141B33groundpage background#0F1530surfacealternating sections#1B2342surfaceMutedcards, inputs, wells#0A1024banddark sections stay a step deeper than the page#141B33bandTintcards inside a dark section#070B1AbandDeepfooter bottom#F2F4F8inkheadlines and body copy#C9D0E2inkSoftsecondary headlines#C9D0E2text2supporting copy#9AA3BDtext3mutedrgba(255,255,255,0.12)borderhairlinesrgba(255,255,255,0.24)borderStrongemphasised dividers#F2F4F8onBandtext on a dark section#9AA3BDonBandText2secondary text on a dark sectionrgba(255,255,255,0.12)onBandBorderhairlines on a dark sectionType
Instrument Sans for headlines. Plex for language. Mono for proof.
Mono is the credibility voice — numbers, step labels, timestamps, URLs. Infrastructure brands earn trust in monospace.
displayXlh1h2h3bodyLgbodybodySmeyebrowlabelmonoStatus ladder
Every claim carries its tier.
These three are the only labels a capability may wear. They mirror the executive brief, so a status cannot say one thing on a page and another in the source.
Voice
aphorism headline → mechanism subhead → proof component
No headline ships without the mechanism directly under it, and no mechanism ships without a proof frame, diagram or recording.