Brandkit

This generates a complete design token system from a brand brief: primitive color ramps in OKLCH, semantic mappings for light and dark modes, type scales, spacing, and motion, all exported as DTCG JSON and a single theme.css. It runs WCAG contrast validation automatically and enforces the three-tier token architecture (primitive, semantic, component) so you never hardcode colors again. Use it when you need a themeable foundation before building screens, or when you're tired of inconsistent palettes and want one source of truth. The output is verifiable (it includes Python scripts for contrast and reference checking), though the brand feel still needs a human eye. It's opinionated about structure but that's the point.

Install to Claude Code

npx -y skills add plugin87/ux-ui-agent-skills --skill brandkit --agent claude-code