--- name: brand-guidelines description: Audit and enforce brand consistency across UI, copy, and assets. Use when reviewing designs, copy, or code for brand alignment. --- # Brand Guidelines Skill Use when: reviewing a new feature's UI, writing copy, creating assets, or checking that output matches the brand. ## Before Starting Ask the user for (or check the repo for): - Brand colors (primary, secondary, accent, neutrals) - Typography (heading font, body font, sizes) - Logo usage rules (clearspace, minimum size, forbidden treatments) - Voice & tone guidelines - Approved imagery style ## Audit Checklist ### Color - [ ] Only approved brand colors used? - [ ] No off-brand gradients or tints? - [ ] Interactive states still use brand palette? ### Typography - [ ] Correct font families loaded and applied? - [ ] Heading hierarchy matches brand spec? - [ ] No unauthorized font weights or styles? ### Logo & Marks - [ ] Correct logo file (SVG preferred)? - [ ] Minimum clearspace respected? - [ ] Not stretched, recolored, or modified? ### Voice & Tone - [ ] Formal vs casual matches brand persona? - [ ] Industry jargon level appropriate for audience? - [ ] Consistent terminology (don't mix "sign in"/"log in")? - [ ] Active voice, second person ("you"), present tense? ### Imagery & Icons - [ ] Icon style consistent (line vs filled, weight, corner radius)? - [ ] Photography style matches brand (candid vs staged, diversity)? - [ ] Illustrations match brand style guide? ### Spacing & Layout - [ ] Grid system consistent with brand templates? - [ ] White space usage matches brand's density preference? ## Output List violations by category with: - Location (component/page/file) - What's wrong - What it should be per guidelines