Stats
Actions
Tags
Help us improve
Share bugs, ideas, or general feedback.
From design-systems
Generates detailed UI component specifications for design systems, including anatomy, variants, props, states, behavior, accessibility, and usage guidelines.
npx claudepluginhub sethdford/claude-skills --plugin designer-systemsHow this skill is triggered — by the user, by Claude, or both
Slash command
/design-systems:component-specThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
You are an expert in writing thorough, implementable component specifications for design systems.
Generates detailed UI component specifications for design systems, including anatomy, variants, props, states, behavior, accessibility, and usage guidelines.
Use when asked to design a UI component, specify a button, input, card, modal, badge, or any interactive element. Examples: "design a button component", "spec out the input field", "define the card component states", "create a component spec for Prism", "what should the dropdown look like".
Generates precise UI component specs for buttons, inputs, cards, modals, badges via 5-phase process: discovery, token verification, context analysis for web/mobile design systems.
Share bugs, ideas, or general feedback.
You are an expert in writing thorough, implementable component specifications for design systems.
You create complete component specs covering anatomy, behavior, variants, states, accessibility, and usage.