Generate a complete, accessible brand design system from a brief — primitive → semantic → component DTCG tokens (color, type, spacing, radius, shadow, motion), light + dark, plus a single theme.css — verified for WCAG. Use when the user wants a from-scratch brand/design foundation, a new palette + type system, or a themeable token kit for a product.
Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.
What the file says
# Skill: Brand Kit
> **Step 0 — is the kit here?** This skill reads files from the kit. Check once:
> `ls ${CLAUDE_SKILL_DIR}/../../../tokens >/dev/null 2>&1 && echo KIT_OK || echo KIT_MISSING`
> On `KIT_MISSING` only the skill folders were installed, which is what
> `npx skills add` does. Say so plainly, point the user at
> `npx ux-ui-agent-skills init` or the plugin install, and stop. Do not guess the
> contents of a file you could not open.
Stand up the *foundation* (one token system everything renders from) before any screen. Get this right and every page stays consistent and themeable from one place.
## Steps
1. **Brief Inference (mandatory)** — name the industry, audience, the one mood adjective, and motion depth (`${CLAUDE_SKILL_DIR}/../../../taste/design-taste.md` → Brief Inference). Pick an anchoring archetype from `${CLAUDE_SKILL_DIR}/../../../taste/aesthetic-systems.md`.
2. **Primitives** — generate the brand color ramp in **OKLCH** (11 shades, consistent chroma) + a neutral ramp; verify the 500 shade ≥ 4.5:1 on white (text) and 600 ≥ 3:1 (UI) per `.claude/rules/tokens-and-color.md` → Color Generation.
…
The line at the top of this page pins the label git:20261006.5751441, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.
GET https://markdownregistry.com/api/v1/artifacts/art_zi6v422kwfibqxwx
GET https://markdownregistry.com/api/v1/resolve?ref=plugin87/ux-ui-agent-skills/brandkit
GET https://markdownregistry.com/api/v1/blob/9057b2bddf07779cc61a61abae3f84196e1468ac67911996f639f56a9261a1b3
Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
plugin87/ux-ui-agent-skills · .claude/skills/a11y-audit/SKILL.md · Audit a UI or design against WCAG 2.2 AA/AAA and ARIA patterns, returning criterion-referenced findings with severity…
plugin87/ux-ui-agent-skills · .claude/skills/apply-aesthetic/SKILL.md · Apply a visual direction — an archetype (high-end agency, editorial minimal, brutalist, soft-SaaS, dark-tech) or one of…
plugin87/ux-ui-agent-skills · .claude/skills/critique/SKILL.md · Adversarial design critique of the current work — render it, look at it, and argue for rejection. Run after the gates…
plugin87/ux-ui-agent-skills · .claude/skills/data-dashboard/SKILL.md · Build a dense, data-heavy screen - an analytics console or a trading terminal - with real charts drawn from tokens…
plugin87/ux-ui-agent-skills · .claude/skills/design-component/SKILL.md · Design a UI component spec to the house quality bar — anatomy, variants, sizes, the 8 states, token mapping, and…
plugin87/ux-ui-agent-skills · .claude/skills/design-doctrine/SKILL.md · The house rules for ANY design or UI work - the verification protocol (run the gate, never claim a number), the…
plugin87/ux-ui-agent-skills · .claude/skills/design-review/SKILL.md · Review or audit a design/UI across 6 weighted dimensions with Nielsen's 10 heuristics and a prioritized findings table…
plugin87/ux-ui-agent-skills · .claude/skills/design-screen/SKILL.md · Design or build a page, screen, landing page, website, app or UI from a request - the whole job, end to end. Use this…
plugin87/ux-ui-agent-skills · .claude/skills/design-tokens/SKILL.md · Generate, extend, or audit design tokens in DTCG format with the 3-tier architecture (primitive → semantic →…
plugin87/ux-ui-agent-skills · .claude/skills/figma-integration/SKILL.md · Keep Figma and code in sync — map the 3-tier DTCG tokens to Figma Variables (collections + modes), sync in either…
