identity system
Brand Guide
One source of truth. Everything here is generated from lib/brand.ts and the tokens in globals.css — so the site, logo, and this guide can never drift apart.
01
Logo
Forge & Pixellockup · on dark
Forge & Pixelwordmark · on light
mark · app icon
The signature element is the & — the forge spark where craft meets code. The mark fuses that ember spark with cyan→violet “pixel” squares. Keep clear space of at least the mark’s height around the lockup; never recolor the ampersand to anything but ember.
02
Color
Surfaces
bg
#06070d
bg-2
#0a0c15
surface
#0f1320
surface-2
#151a2b
elevated
#1b2236
line
#232a40
Text
fg
#f4f6fc
fg-2
#aeb7cf
fg-3
#6f7a96
Brand accents
brand
#38e1ff
Pixel — electric
brand-2
#a855f7
Digital depth
spark
#ff6a2c
Forge ember — the "&"
Status
pos
#34d399
warn
#fbbf24
neg
#f87171
info
#60a5fa
03
Industry accents
Each demo product gets its own neon accent so it reads as purpose-built software — never a reskin. Shared chrome, distinct soul.
Helix Commerce
#a855f7 · #ec4899
Atlas Underwriting
#2e8bd6 · #7bc8e8
Keystone Pursuit
#f59e0b · #fb923c
Meridian Ledger
#2dd4bf · #22d3ee
Ember Restaurant
#fb7185 · #f43f5e
Volt Field Ops
#3b82f6 · #38bdf8
04
Typography
Space Grotesk — display
font-display · headlines, product chrome
Cormorant Garamond — institutional
font-serif · reserved for the CRE underwriting desk
Inter — the workhorse for body copy and UI.
font-sans · everything else
JetBrains Mono — 1,234.56 · KPIs
font-mono · figures, labels, codes
05
Components
BUYCONDITIONALFAIL