All guides

Use the design skill

Teach your AI tool our design rules, so the UI it builds matches the designs.

Pro or Lifetime

When the library doesn’t have what you need, your AI tool builds it. The design skill gives it our design system: the colours, type, spacing, states and accessibility rules, 43 ready recipes and two checkers, so what it builds looks like it belongs with the designs.

Download it
Open AI tools and CLI from the account menu and click Download skill.
Put it in your project
Unzip it. Inside the readymadeui-design-skill folder are a .claude folder and an AGENTS.md file. Move both into your project’s main folder.
On a Mac, folders starting with a dot are hidden: press Cmd + Shift + . in Finder to see them.
Install the checkers
Run this once from your project’s main folder:
```
cd .claude/skills/readymadeui-design && npm install
```
Ask your tool to build
Claude Code finds the skill by itself. Cursor, Codex and other tools read AGENTS.md. Ask as usual, “build an onboarding checklist”, and it follows the rules.

Getting updates

The AI tools page shows your version and a New version badge when the rules change. Download it again and replace the old files.

Still stuck? Email support@readymadeui.com and we’ll help.