skills.rest
billiampalad
billiampaladCOMMUNITY
Explore all skills by this author →
GitHub

brand

Manage brand voice, visual identity, and asset consistency with validation scripts.

1|Updated Mar 9, 2026
Search Tags:#typography#color palette#brand guidelines#design tokens#brand voice#css variables#asset validation
One-click install
npx skills add https://github.com/billiampalad/wd4 --skill brand-billiampalad
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: brand
Source: https://github.com/billiampalad/wd4/tree/main/.agents/skills/design/ui-ux-pro-max-skill-main/.claude/skills/brand
Command: npx skills add https://github.com/billiampalad/wd4 --skill brand-billiampalad

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Keeping brand voice, colors, typography, and marketing assets consistent across teams and channels is difficult when guidelines live in scattered documents and assets go unvalidated. ## Core Features & Use Cases - Brand Context Injection: Extract colors, typography, voice traits, and image-generation style rules from brand-guidelines.md into prompts or JSON. - Design Token Sync: Convert brand guideline colors into design-tokens.json and regenerate design-tokens.css automatically. - Asset Validation: Check marketing assets against naming conventions, file size limits, formats, and manifest registration. - Use Case: A marketing team updates their primary color in docs/brand-guidelines.md, runs the sync script to propagate it into CSS variables, then validates a new campaign banner before publishing. ## Quick Start Ask the assistant to update the brand colors in docs/brand-guidelines.md and sync them into the design tokens and CSS files.

Frequently Asked Questions about brand

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I sync brand colors to design tokens?▼

Edit docs/brand-guidelines.md with your new colors, then run node scripts/sync-brand-to-tokens.cjs. The script extracts hex values from the guideline tables, updates design-tokens.json, and regenerates design-tokens.css.

How do I validate a marketing asset against brand guidelines?▼

Run node scripts/validate-asset.cjs with the asset path. It checks the filename convention (type_campaign_description_timestamp), file format, file size limits, and whether the asset is registered in .assets/manifest.json.

What naming convention does the asset validator enforce?▼

Filenames must follow the pattern type_campaign_description_YYYYMMDD_variant.ext in lowercase kebab-case, for example banner_claude-launch_hero-image_20251209.png. The validator suggests a corrected filename when the pattern fails.

Can I extract brand colors from an image file?▼

The extract-colors.cjs script loads the brand palette from your guidelines and generates an ImageMagick histogram command to pull dominant colors from an image. It then compares extracted colors against the palette using RGB distance to compute compliance.

What file do the brand scripts expect to exist?▼

The scripts expect docs/brand-guidelines.md at the project root as the source of truth. If it is missing, inject-brand-context.cjs and extract-colors.cjs exit with an error telling you to create the guidelines file first.

Related Skills

Explore More Design & Creative Skills→
Spectra29115Spectra29115

branding-generator

Generate brand identity kits with logos, color palettes, typography, and style guides.

Community
Advanced
carterwayneskhizeinecarterwayneskhizeine
19

popular-web-designs

Generate HTML and CSS from real-world design system templates.

Community
Intermediate
kuse-aikuse-ai
6

brand-voice-generator

Generate standardized brand voice guidelines for cross-channel content production.

Official
Basic
AradotsoAradotso
3

figma-console-mcp-design-system-api

Synchronize Figma design tokens and components with code-ready formats.

Official
Advanced