brand
nextlevelbuilder/ui-ux-pro-max-skill
Manage brand voice, visual identity, messaging, and asset consistency across projects.
What is brand?
The brand skill provides frameworks and tools for defining and maintaining brand identity, including voice guidelines, visual standards, messaging frameworks, and asset management. Use it when creating branded content, establishing style guides, auditing brand compliance, or organizing brand assets.
- Define and inject brand voice and tone guidance into content creation
- Manage visual identity standards including color palettes and typography specifications
- Create and maintain messaging frameworks and brand guidelines
- Validate assets against brand naming, format, and size standards
- Extract and compare colors from designs against approved palettes
- Sync brand guidelines to design tokens (JSON and CSS variables)
How to install brand
npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill brand- Node.js environment to run scripts
- docs/brand-guidelines.md file (or use the starter template)
- Optional: design files or assets to validate
How to use brand
- 1.Edit or create docs/brand-guidelines.md with your brand identity details
- 2.Run `node scripts/inject-brand-context.cjs` to extract brand context for use in prompts
- 3.Run `node scripts/sync-brand-to-tokens.cjs` to sync guidelines to design-tokens.json and design-tokens.css
- 4.Use `node scripts/validate-asset.cjs <asset-path>` to check assets against brand standards
- 5.Use `node scripts/extract-colors.cjs <image-path>` to extract and compare colors against your palette
Use cases
- Establish a complete brand guideline document for a new product or company
- Audit existing marketing assets for brand consistency and compliance
- Create design tokens from brand guidelines to ensure consistency across web and design tools
- Define voice and messaging frameworks for marketing teams and content creators
- Validate logo usage, color application, and typography in design files
- Brand managers and strategists
- Marketing and content teams
- Design and UX professionals
- Product managers overseeing brand consistency
- Teams building design systems
brand FAQ
Use the starter template at templates/brand-guidelines-starter.md as a foundation, then edit docs/brand-guidelines.md with your brand details and run the sync script.
Yes. Use `node scripts/validate-asset.cjs <asset-path>` to check naming, size, and format compliance, and `node scripts/extract-colors.cjs` to verify color usage.
Edit docs/brand-guidelines.md (your source of truth), then run `node scripts/sync-brand-to-tokens.cjs` to automatically update assets/design-tokens.json and assets/design-tokens.css.
Run `node scripts/inject-brand-context.cjs` or `node scripts/inject-brand-context.cjs --json` to extract structured brand context for use in AI prompts.
Refer to the references/ folder: voice-framework.md, visual-identity.md, messaging-framework.md, consistency-checklist.md, and others for in-depth guidance.
Full instructions (SKILL.md)
Source of truth, from nextlevelbuilder/ui-ux-pro-max-skill.
name: brand description: Brand voice, visual identity, messaging frameworks, asset management, brand consistency. Activate for branded content, tone of voice, marketing assets, brand compliance, style guides. argument-hint: "[update|review|create] [args]" metadata: author: claudekit version: "1.0.0"
Brand
Brand identity, voice, messaging, asset management, and consistency frameworks.
When to Use
- Brand voice definition and content tone guidance
- Visual identity standards and style guide development
- Messaging framework creation
- Brand consistency review and audit
- Asset organization, naming, and approval
- Color palette management and typography specs
Quick Start
Inject brand context into prompts:
node scripts/inject-brand-context.cjs
node scripts/inject-brand-context.cjs --json
Validate an asset:
node scripts/validate-asset.cjs <asset-path>
Extract/compare colors:
node scripts/extract-colors.cjs --palette
node scripts/extract-colors.cjs <image-path>
Brand Sync Workflow
# 1. Edit docs/brand-guidelines.md (or use /brand update)
# 2. Sync to design tokens
node scripts/sync-brand-to-tokens.cjs
# 3. Verify
node scripts/inject-brand-context.cjs --json | head -20
Files synced:
docs/brand-guidelines.md→ Source of truthassets/design-tokens.json→ Token definitionsassets/design-tokens.css→ CSS variables
Subcommands
| Subcommand | Description | Reference |
|---|---|---|
update | Update brand identity and sync to all design systems | references/update.md |
References
| Topic | File |
|---|---|
| Voice Framework | references/voice-framework.md |
| Visual Identity | references/visual-identity.md |
| Messaging | references/messaging-framework.md |
| Consistency | references/consistency-checklist.md |
| Guidelines Template | references/brand-guideline-template.md |
| Asset Organization | references/asset-organization.md |
| Color Management | references/color-palette-management.md |
| Typography | references/typography-specifications.md |
| Logo Usage | references/logo-usage-rules.md |
| Approval Checklist | references/approval-checklist.md |
Scripts
| Script | Purpose |
|---|---|
scripts/inject-brand-context.cjs | Extract brand context for prompt injection |
scripts/sync-brand-to-tokens.cjs | Sync brand-guidelines.md → design-tokens.json/css |
scripts/validate-asset.cjs | Validate asset naming, size, format |
scripts/extract-colors.cjs | Extract and compare colors against palette |
Templates
| Template | Purpose |
|---|---|
templates/brand-guidelines-starter.md | Complete starter template for new brands |
Routing
- Parse subcommand from
$ARGUMENTS(first word) - Load corresponding
references/{subcommand}.md - Execute with remaining arguments
Related skills
More from nextlevelbuilder/ui-ux-pro-max-skill and the wider catalog.
ckm:banner-design
Design multi-format banners for social, ads, web, and print with AI-generated visuals and multiple art directions.
ckm:brand
Define and enforce brand voice, visual identity, messaging, and asset consistency across projects.
ckm:design
Unified design skill for brand identity, logos, design systems, UI, presentations, banners, icons, and social media graphics.
ckm:design-system
Three-layer token architecture, component specs, and brand-compliant slide generation with design-to-code handoff.
ckm:slides
Create strategic HTML presentations with Chart.js, design tokens, and data visualization.
ckm:ui-styling
Build accessible, beautiful UIs with shadcn/ui components, Tailwind CSS utilities, and canvas-based visual design.