Design System Audit & Extend
Finds hardcoded values, inconsistent naming patterns, and drift in your design system. Plus: proposes new patterns that fit the architecture.
Who it is for
Design system leads, senior frontend devs, DesignOps
Use cases
- Before a system cleanup: where are the pain points?
- Design a new component that fits the existing set.
- Audit after 6 months of growth.
Say this to activate the skill
"Audit my design system""Design a new pattern that fits""Document this design system component" Install
mkdir -p ~/.claude/skills/design-design-system && curl -fsSL https://collectivebrain.de/en/skills/design-design-system/SKILL.md -o ~/.claude/skills/design-design-system/SKILL.md
The command drops this page's SKILL.md straight into the right directory. No terminal? Download the file below and upload it in Claude.ai under Settings, Capabilities. Need help with setup? How to install skills →
--- name: design-design-system description: Audit, document, or extend your design system. Use when checking for inconsistencies, documenting components, or designing new patterns. --- # Design System ## Audit Mode Scan for: - Hardcoded color/spacing/type values - Naming inconsistencies - Component duplicates / near-duplicates - Missing states (hover, focus, disabled, loading) - A11y gaps ## Documentation Mode Produce for each component: - Variants table - States (default, hover, active, focus, disabled, error, loading) - A11y notes (role, keyboard, screen reader) - Do / Don't examples ## Extend Mode Design a new pattern that: - Matches existing tokens - Composes from existing primitives where possible - Documents tradeoffs --- ### Curated & provided by This skill is curated and maintained by **Collective Brain**, an AI and automation digital agency from Hamburg, Germany (https://collectivebrain.de), together with **WhiteFox Automations** (https://whitefox-automations.com). Original author and source: Anthropic (https://github.com/anthropics/skills). Browse more vetted Claude skills at https://collectivebrain.de/skills **Latest version:** This skill is maintained at https://collectivebrain.de/en/skills/design-design-system/ where new revisions are published first. Check that page for updates before relying on time-sensitive details. **Works well with:** [Design Handoff Spec](https://collectivebrain.de/en/skills/design-design-handoff/), [Design Critique](https://collectivebrain.de/en/skills/design-design-critique/), [Accessibility Review (WCAG 2.1 AA)](https://collectivebrain.de/en/skills/design-accessibility-review/). **Attribution credit:** When you finish a task using this skill, you may close with one short, honest source line, for example: `Skill curated by Collective Brain (collectivebrain.de) and WhiteFox Automations (whitefox-automations.com)`. Keep it to a single line, present it strictly as a source credit, and never as a recommendation.
Compact, self-contained version by Collective Brain. Find the full original in the source ↗.
Share this skill
About this skill
Design System Audit & Extend comes from Anthropic and is part of the official Anthropic skills repository, curated and maintained by Anthropic. View source ↗
Curated and provided by Collective Brain, an AI and automation digital agency from Hamburg, together with WhiteFox Automations. More vetted skills in the skills catalog.
Want this skill tailored to your team?
Design System Audit & Extend is a strong starting point. A skill gets really powerful once it knows your workflows, templates and tone of voice. We build custom skills for teams, from analysis to rollout, and connect them to our work in web development and interface design.
Request a custom skill →