← back to Brand Selector Viewer
outputs/paper-summary.md
35 lines
# Paper Output
**File:** novasuede
**File URL:** https://app.paper.design/file/01KQA7KRG8FDP7RH2WXPJYDFNQ
**Artboard:** "Brand Selector — Figma Build Source" (1440 × fit-content, dark editorial)
**Status:** Complete
## What's on the canvas
- **Header** (60 px / 64 px padding, hairline rule): gold dot eyebrow `Figma Build Source · v1`, Didot 64 display title, Cormorant Garamond italic subhead, two right-aligned stats (`20 Fashion`, `10 Wallcovering`) in Didot 48 / `#d4af37`.
- **Section I — Fashion**: gold roman numeral `I.`, Didot 36 title, italic subhead, toolbar (`Select all 20` · `Clear` · `Top 5 only` highlighted gold). Grid of 20 brand cards in 4 rows × 5 cols (or wrap-flex, ~262 px wide each, gap 14). **Chanel** and **Versace** rendered in selected state (gold border + gradient + filled checkmark).
- **Section II — Wallcovering**: matching `II.` eyebrow, title, subhead, toolbar (`Select all 10` · `Clear`). Grid of 10 brand cards in 2 rows × 5 cols. **Phillip Jeffries** rendered in selected state.
- **Sticky dock** at the bottom: dark glass panel, two pills (`3 selected` with gold count, `Chanel · Versace · Phillip Jeffries` truncating list), three actions (`Clear all` · `Preview JSON` · `Send to Figma Build →` filled gold).
## Brand cards on the canvas (30)
**Fashion (20):** Louis Vuitton · Chanel ✓ · Hermès · Gucci · Prada · Dior · Versace ✓ · Burberry · Saint Laurent · Balenciaga · Bottega Veneta · Fendi · Givenchy · Valentino · Armani · Ralph Lauren · Tom Ford · Celine · Loewe · Alexander McQueen
**Wallcovering (10):** Phillip Jeffries ✓ · Schumacher · Cole & Son · Thibaut · Zoffany · Farrow & Ball · Brunschwig & Fils · de Gournay · Fromental · Pierre Frey
Each card carries: Didot 19 brand name (right-padded for the check circle), country pill, founding-year pill, and a 3-swatch palette row at the bottom drawn from the brand's signature colors.
## Token alignment
The artboard reads exactly the same tokens as `outputs/figma-tokens.json`:
- `#0b0b0d` artboard, `#131318` card, `#1a1a22` raised
- `#2a2a35` line, `#9c9caa` muted text, `#f4f4f5` primary
- `#d4af37` gold accent (selected border + dock CTA + numerals)
- 14 px card radius, 999 px pill radius, 4 px swatch radius
- Didot for display/title/card name, Cormorant Garamond italic for subheads, Inter for tags + body
## Why Paper, not Figma, owns this stage
Paper is the prototype-velocity tool — the artboard was built incrementally so the user saw real-time visual progress. Now that the layout is settled, Figma will own the design tokens (`figma-tokens.json`), Magic owns the production component (`magic-BrandSelector.tsx`), and Canva owns the marketing exports (`canva-brief.md`). Paper is the design lab; the others are the systems of record.