Brand Guideline · v1.0
The LUMA·E brand system
The single source of truth for every LUMA·E surface — website, invoices, CRM, proposals, decks and social. One palette, three typefaces, one set of rules.
Growth, engineered with intention.
Wordmark
LUMA and E are both set at weight 600, separated by a middle dot (U+00B7) — no hyphen, no em dash. The dot is the only accent inside the logo, and because it is a real Unicode character the logo and the plain-text name stay identical.
On canvas — dot in Teal Deep
On white — invoices, print
Reversed — dot in Teal
Single colour — the dot takes the letter colour
- Write it LUMA·E in plain text — email, Slack, Jira, invoices, titles.
- Dot in Teal Deep #0B6E73 on light, Teal #4ECDC4 on dark.
- In single-colour output the dot matches the letter colour.
- Keep luma-e.com, leo@luma-e.com hyphenated for domain, email, handles.
- Reintroduce a hyphen or em dash inside the wordmark.
- Swap the middle dot for a bullet •, full stop, or add spaces around it.
- Set the dot any colour other than Teal Deep, Teal, or the letter colour.
- Fill the mark's ring with teal — teal is the core only.
Logo & mark
The identity has two parts: the Aperture mark and the LUMA·E wordmark. Either can stand alone; together they form the primary lockup. Assets below live in /brand as SVG — for favicons, avatars, print and social.
The mark — Aperture
Primary — navy ring, Teal Deep core
Reversed — canvas ring, Teal core
Single colour — stamps, embossing, engraving
Horizontal lockups
Primary — site header, email signature, invoice
Reversed — dark sections, social graphics
Single colour — stamp, emboss, fax
Favicon & avatar
Favicon — mark on a rounded navy tile
Avatar — mark on a navy circle, social profile
Colour
Four brand colours, one neutral ramp derived entirely from navy, four semantic states. Nothing else is approved. Every pairing below is measured to WCAG 2.1.
Brand core
Hard rule — teal is not a text colour on light. #4ECDC4 on canvas measures 1.79:1 against a 4.5:1 requirement. Use #0B6E73 (Teal Deep) for anything readable on light, and reserve #4ECDC4 for navy backgrounds.
Neutral ramp — all tints of navy, so greys never drift warm
Semantic states
Contrast matrix — measured, WCAG 2.1
| Foreground | Background | Ratio | Level | Use |
|---|---|---|---|---|
| Navy #1A2332 | Canvas #F4F7F2 | 14.61 | AAA | Default body pairing |
| Navy #1A2332 | White #FFFFFF | 15.78 | AAA | Cards, tables, print |
| Canvas #F4F7F2 | Navy #1A2332 | 14.61 | AAA | Reversed sections |
| Ink 2 #444B58 | Canvas #F4F7F2 | 8.12 | AAA | Secondary copy |
| Ink 3 #656B78 | Canvas #F4F7F2 | 4.95 | AA | Muted copy — safe |
| Ink 4 #9AA0AB | Canvas #F4F7F2 | 2.43 | Fail | Placeholder / disabled only |
| Teal #4ECDC4 | Navy #1A2332 | 8.16 | AAA | Approved accent pairing |
| Teal #4ECDC4 | Navy Deep #232F42 | 6.97 | AA | Accent on raised dark surface |
| Teal #4ECDC4 | Canvas #F4F7F2 | 1.79 | Fail | Never use for text |
| Teal Deep #0B6E73 | Canvas #F4F7F2 | 5.56 | AA | Accent text on light |
| Teal Deep #0B6E73 | White #FFFFFF | 6.01 | AA | Accent text on cards / paper |
| Teal Deep #0B6E73 | Teal Soft #E6F7F5 | 5.44 | AA | Accent badge |
| Navy #1A2332 | Teal #4ECDC4 | 8.16 | AAA | Accent button label |
| Success #15803D | Canvas #F4F7F2 | 4.64 | AA | Status text |
| Danger #B91C1C | Canvas #F4F7F2 | 5.99 | AA | Error text |
| Warning #B45309 | Canvas #F4F7F2 | 4.65 | AA | Warning text |
| Info #3D2C8D | Canvas #F4F7F2 | 10.00 | AAA | Info text, links |
Typography
Three families, each with a single job. Bricolage Grotesque for display, Inter for everything readable, JetBrains Mono for labels and figures.
Headings H1–H5, the wordmark, big numbers. Weight 600 default, 700 for the wordmark dot. Never below 14px.
Running text, UI labels, buttons, forms, tables. Weights 400 / 500 / 600. Never above 24px — that's Bricolage's job.
Eyebrows, section numbers, metrics, invoice numbers, code. Uppercase with 0.12em tracking for labels.
Scale
Usage
The short version. When in doubt, less — one anchor per section, generous whitespace, ink first and accent last.
- Reference var(--color-*) tokens for every colour — never hardcode a hex.
- Set the wordmark as live text: LUMA·E with the middle dot (U+00B7).
- Teal #4ECDC4 on dark only; use Teal Deep #0B6E73 for teal text on light.
- Bricolage for display, Inter for body, JetBrains Mono for labels and figures.
- Canvas page base, white cards, navy for the hero and closing sections.
- One hit of accent per screen — scarcity is what reads premium.
- Reintroduce gold or any metallic accent — retired for failing contrast.
- Put a hyphen or em dash inside the wordmark instead of the middle dot.
- Bring back the old social orange — retired 10 Aug 2026; teal replaces it.
- Recolour the wordmark dot to navy or black on brand surfaces.
- Set teal #4ECDC4 as text on a light background — 1.79:1, fails WCAG.
- Use a serif for headings, pill buttons, card shadows, or gradient fills.
Growth, engineered with intention. · Contrast measured to WCAG 2.1