brand-kitlisted

# brand-kit — Stage 1 + 2 research skill (PMM spine) Compiles visual identity into a structured brand kit. Output format: DESIGN.md (YAML token frontmatter + 8 prose sections). The YAML tokens are the machine-authoritative source — downstream skills that produce visual output (landing-page wireframes, ad creative briefs, slide decks) consume the tokens directly. --- ## When to use - When the team refreshes visual identity (new color palette, new typography system) - Before building any landing page, ad creative, or designed artifact — they need the brand kit as input - Quarterly refresh ## When NOT to use - For voice / tone (use `/tov-guidelines` — voice + visual are separate but both live in `marketing/brand/`) - For positioning or messaging (use `/positioning` or `/product-messaging`) - For one-off design checks (write a custom gate skill that reads `brand-kit.md` tokens) ## How it works 1. Inputs: screenshots of your product / website (primary, higher fidelity) OR website URL (fallback, lower fidelity). 2. Reads: visual content via Claude's vision (screenshots) or Exa MCP web fetch (URL). 3. Extracts: exact colors (hex codes), typography stack (font family + sizes + weights + line heights + letter spacing), spacing scale, corner radii, component patterns (button states, card styles, input styles, etc.). 4. Produces a DESIGN.md-format brand kit: - **YAML token frontmatter** (machine-authoritative): colors, typography, rounded, spacing, components — token referenc