Install and use Create DESIGN.md
Install the Skill
Run the upstream command in your project, then follow the author’s setup guide and any requirements below.
npx skills add ibelick/ui-skills --skill create-design-mdGive your agent a task
Provide the relevant files, context and constraints. For example:
Inspect this project or public website and draft a DESIGN.md grounded in observed evidence; validate it.
About this Skill
Create an evidence-based DESIGN.md from a product repository or a rendered public website.
Why we picked it
Turns observed design rules into a documented, validated format rather than copying every repeated style.
What it helps with
- Give coding agents durable design context for an existing product.
Scope and limitations
For a public URL the output is a reconstructed draft. The existing Extract Design System listing produces starter JSON/CSS tokens; this workflow instead creates and validates a DESIGN.md document.
Alternatives and related workflows
Extract Design System: JSON and CSS tokens
Both study existing design evidence. Create DESIGN.md documents and validates design guidance; Extract Design System produces starter JSON and CSS tokens from a public website.
Before you use it
- Requires access to the project or rendered browser evidence and the @google/design.md CLI for lint and export checks.
Sources & references
Original sources are linked below. Practical starting points are editorial suggestions from SkillHey.
