topskills

design-system

Design-system hygiene at speed. Audit, document, extend.

Score 0(?)OfficialAll surfacesby AnthropicSource
Verified for:

Install

$ claude plugin install design

Skill becomes available as /design-system

Best for

Teams maintaining a real design system that has grown organically.

About this skill

Audit, document, or extend your design system. Catch naming inconsistencies, hardcoded values, undocumented variants and missing accessibility notes.

Design SystemAuditDocumentation

Score breakdown

Score breakdown

rubric 1.0
Install count
0/20
Provenance
15/15
GitHub stars
0/15
Recency
6/10
Compatibility
6/10
Documentation depth
6.5/10
Install ergonomics
7/10
License
5/5
Verification freshness
3/5

Composite 0–100 score derived from 9 verifiable signals. See the rubric →

Related skills

Official

Escape generic AI-generated UIs. Forces a bold, distinctive design direction before any code is written.

ReactTailwindDesign
All surfaces
Low1 min
Official

Self-contained HTML artifacts with React + shadcn/ui — no build step, just paste and run.

Reactshadcn/uiArtifacts
All surfaces
Low1 min
Official

Lock generated UIs to a brand. Anthropic's own guidelines, formalized as a skill.

BrandGuidelinesIdentity
All surfaces
Low1 min

Ranked #14 in Frontend & UI

Publish the ranking in your README. The badge reads the live score, so it updates when the ranking does.

design-system — ranked #14 in Frontend & UI on Top Agent Skills
Markdown
[![design-system — ranked #14 in Frontend & UI on Top Agent Skills](https://top-agent-skills.com/badge/design-system.svg)](https://top-agent-skills.com/skill/design-system)
HTML
<a href="https://top-agent-skills.com/skill/design-system"><img src="https://top-agent-skills.com/badge/design-system.svg" alt="design-system — ranked #14 in Frontend & UI on Top Agent Skills"></a>

Skill FAQ

About design-system

What is the design-system skill?

Audit, document, or extend your design system. Catch naming inconsistencies, hardcoded values, undocumented variants and missing accessibility notes.

Which agents does design-system work with?

Claude Code, Cursor, Antigravity IDE.

How do I install design-system?

Run `claude plugin install design` for Claude Code. See the install panel for per-agent commands.

Is design-system free to use?

Yes — design-system is open source (MIT).

Who maintains design-system?

design-system is published by Anthropic and was last updated on 2026-05-15.

What is design-system best for?

Teams maintaining a real design system that has grown organically.