# Build Club X — Brand Dossier

Lineage: Build Club → Build Club X. This dossier covers **Build Club X** (the focus) plus its parent brand **Build Club**, whose identity it inherits (logos, core tokens, shared voice).

## Brand: Build Club X
> The X system on the web — dark-first, dual-persona, one accent at a time.

How Build Club X shows up on the web — the system proven on the live consulting site, which is the master reference. The brand book's monochrome severity relaxes into a charcoal (never pure black) canvas with a porcelain light mode; lime speaks to companies and a periwinkle answers for the builders who moonlight; and the textures — waven waves, scanlines, a night sky, a blurred holographic blob or a halftone moon in the corner, a ghost pixel-X — decorate at whisper opacity while content stays monochrome.

- Type: Community
- Path: /build-club/x
- Assets: https://brand.buildclub.ai/brands/build-club/x/

### Typography
- Display: GC North Sans — 130% line height, −2% tracking
- Body: Inter — 150% line height, 0% tracking
- Mono: Inter — Numerics, code, tables

**Scale**
- Display: 56px/120% Medium (heading) — Hero and largest titles
- Heading 1: 40px/120% Medium (heading) — Primary page headings
- Heading 2: 28px/120% Medium (heading) — Section headings
- Heading 3: 20px/120% Medium (heading) — Card headings
- Heading 4 / Body Bold: 16px/120% Semibold (body) — Bold body and compact headings
- Heading 5 / Body Huge: 20px/120% Regular (body) — Large supporting copy
- Body: 16px/120% Regular (body) — Text base
- Body Medium: 14px/120% Regular (body) — Interface text
- Body Small: 12px/120% Regular (body) — Captions
- Tags: 14px/120% Regular (body) — +6-8% tracking · uppercase

### Color

**Roles**
- Neutral: Neutral `#000000` (token `x/neutral/900`)

**Surfaces**
- Canvas: `#18181B`
- Card: `#212124`
- Secondary: `#26262A`
- Border: `#38383C`

**Ramps**
- Neutral (Neutral, figma): 50 `#F9F9FA`, 100 `#ECECEE`, 200 `#E1E1E2`, 300 `#C9C9CB`, 400 `#9A9A9B`, 500 `#6B6B6C`, 600 `#4A4A4B`, 700 `#3B3B3C`, 800 `#1E1E1F`, 900 `#000000`

**Gradients**
- Holographic foil: `linear-gradient(110deg, #A8E6FF 0%, #B8FFD9 26%, #FBFFC2 50%, #FFD9B8 73%, #E7C2FF 100%)`
- Holo blob (ink): `conic-gradient(from 200deg, #2795C8, #7A66D6, #B8862C, #2E9E67, #C2519B, #2795C8)`

**Core tokens** (shared by every brand)
- Canvas `#18181B` — token `x-web/background` — Dark canvas — zinc, never pure black
- Card `#212124` — token `x-web/card` — Raised cards + tiles
- Secondary `#26262A` — token `x-web/secondary` — Chips, stat tiles
- Text `#FFFFFF` — token `x-web/foreground` — Body + headings on dark
- Muted text `#9A9A9B` — token `x-web/muted` — Secondary text, captions
- Accent `#EAFF75` — token `x-web/lime` — Companies persona — CTAs, keywords, stats
- Border `#38383C` — token `x-web/border` — Hairlines on dark

**Persona accents** — Lime speaks to companies, periwinkle (the foil's violet stop, lifted) to the builders who moonlight — never both at once. On the light canvas the lime dot wears an ink ring, and builder text accents deepen to iris.
- Companies — Lime: `#EAFF75` · icon `#000000` (black text on lime)
- Builders — Periwinkle: `#A797FF` · icon `#000000` (black text on periwinkle)
- Builders — Iris: `#6B54F5` · icon `#FFFFFF` (text accents on light)
- Moon — dark: `#F2EEFD` · icon `#18181B` (--moon-fill on charcoal)
- Moon — light: `#A294D6` · icon `#000000` (--moon-fill on porcelain)

### Voice & Tone
Tones: Confident, Direct, Builder-first

**Do**
- Lead with the outcome — "Find the right AI expert for any project."
- Highlight one keyword per headline: lime type on dark, a lime highlighter behind black type on light.
- Open every section the same way: a dotted tag, a display heading, a muted sub.
- Talk to builders as consultants — moonlighting is the theme, not an entry condition, so never write copy that assumes a day job.

**Don't**
- Don't set lime text or a solid lime button on the light canvas — it dissolves at 1.1:1.
- Don't mix the personas' accents in one surface.
- Don't hand-mix the foil — the supplied blurred asset for texture, the ink-stop conic for blobs.
- Don't put the moon and the foil blob in one surface — they share the corner.

### Principles
- **Dark-first, never black** — The web canvas is charcoal (#18181B) with raised graphite surfaces; the light mode is warm porcelain, never clinical white. Pure black stays in the brand book, print, and social.
- **One accent per persona** — Lime speaks to companies, periwinkle to the builders who moonlight — carried by tag dots, primary CTAs, and whatever occupies the hero's top-right corner. Never both at once.
- **Texture at whisper opacity** — Waven waves, scanlines, a blurred holographic blob, a night sky, and a ghost pixel-X decorate every canvas below ~13% opacity — content stays monochrome and does the talking.

### Motif & Background
**Waven, scanlines & the corner** — Every hero sits on the same stationary canvas: the waven wave texture fading downward, a 1px/6px scanline rhythm, and the pixel-X ghosted at 3%. The top-right corner is one slot with two occupants — a heavily blurred holographic conic glow for companies, a halftone moon over a tiled starfield for the builders who moonlight. The page content slides over it; only the corner trades.

---

## Parent brand: Build Club
> The community where builders ship.

Build Club operates several distinct brands. Some are products, some are sub-brands within a community — but each carries its own identity. This kit keeps them deliberately separate, so every brand can be browsed, themed, and copied on its own terms.

- Type: Organization
- Path: /build-club
- Assets: https://brand.buildclub.ai/brands/build-club/

### Typography
- Display: Host Grotesk — 130% line height, −2% tracking
- Body: DM Sans — 150% line height, 0% tracking
- Mono: PT Mono — 150% line height, 4% tracking

### Color

**Roles**
- Primary: Purple `#5A55E4` (token `core/purple/500`)
- Neutral: Neutral `#464246` (token `core/neutral/700`)

**Surfaces**
- Background: `#F8F7FF`
- Card: `#FFFFFF`
- Muted: `#EBE7FF`
- Border: `#E9E5F7`

**Ramps**
- Purple (Primary, figma): 50 `#F8F7FF`, 100 `#EBE7FF`, 200 `#DAD9F9`, 300 `#BEBBFF`, 400 `#8E8AF0`, 500 `#5A55E4`, 600 `#4C48D0`, 700 `#403CB5`, 800 `#34308F`, 900 `#29256B`
- Neutral (Neutral, derived): 50 `#FBFAFA`, 100 `#F2F1F3`, 200 `#E7E5E4`, 300 `#D2D0D4`, 400 `#A8A29E`, 500 `#78716C`, 600 `#57534E`, 700 `#464246`, 800 `#292524`, 900 `#1C1917`

**Gradients**
- Purple: `linear-gradient(89deg, #5A55E4 0%, #BEBBFF 100%)`

**Core tokens** (shared by every brand)
- Text `#464246` — token `text/default` — Default body + heading color
- Icon `#464246` — token `icon/default` — Default icon color
- Icon brand `#5A55E4` — token `icon/brand` — Brand-tinted icons
- Surface `#F2F1F3` — token `surface/light` — Muted surfaces, fills
- Border `#F2F1F3` — token `border/default` — Hairline dividers
- Border dark `#D2D0D4` — token `border/dark` — Stronger dividers
- Border strong `#464246` — token `border/strong` — High-contrast outlines
- Canvas `#FBFAFA` — token `neutral/50` — App background
- White `#FFFFFF` — token `white` — Cards, sheets
- Black `#000000` — token `black` — Max contrast

**Elements** — Content-type colors. Each pairs a deeper tone with a lighter tint — reverse background/icon as needed.
- Course: `#4B91F2` · light `#E6F0FF`
- Track: `#FCA966` · light `#FEECDF`
- Project: `#F87171` · light `#FFE7E7`
- Challenge: `#E0A80A` · light `#FFECCA`
- Quiz: `#8E8AF0` · light `#EBE7FF`
- Survey: `#3CBF82` · light `#D7FFEA`
- Game: `#DC79E5` · light `#F8DBFB`
- Bounties: `#0ACFDD` · light `#CFF0F3`
- Guide: `#464246` · light `#F2F1F3`
- Blog / Article / Report: `#464246` · light `#F2F1F3`
- Video: `#464246` · light `#F2F1F3`

**Tier / Leaderboard** — Rank tiers shared across brands — each a metallic gradient.
- Platinum: gradient `linear-gradient(200deg, #E5F3FF 0%, #8FACCA 100%)`
- Gold: gradient `linear-gradient(200deg, #FAF0CB 0%, #E6C23B 100%)`
- Silver: gradient `linear-gradient(200deg, #F5F5F5 0%, #C0C0C0 100%)`
- Bronze: gradient `linear-gradient(200deg, #F2DACA 0%, #C08B68 100%)`

### Voice & Tone
Tones: Direct, Energetic, Generous

**Do**
- Lead with the verb — build, ship, learn.
- Speak plainly and respect the reader's time.
- Celebrate what the community makes.

**Don't**
- Don't hype or overpromise.
- Don't bury the point in jargon.
- Don't blur the line between brands.

### Principles
- **Distinct by design** — Every brand keeps its own identity. Build Club never blends them.
- **Builder-first** — Made for people who ship — clear, fast, and useful over decorative.
- **In public** — We learn and build in the open, alongside the community.

### Motif & Background
**Purple wash** — A soft purple glow anchors Build Club surfaces — confident, communal, and unmistakably the core brand.