claudecodeui/claude-skills/brand-guidelines.md

name	description
brand-guidelines	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