Create design system
Local-first, open-source alternative to Anthropic's Claude Design. MIT-licensed, BYO agent CLI — Claude Code, Kimi, Codex, or any SDK-compatible model. Composable skills · three edit paths · designs as plain HTML/JSX/CSS folders · run locally, no cloud round-trip. Generate banners, thumbnails, websites, animations, design systems.
npx -y skills add aiatelie/ai-atelie --skill create-design-systemAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 7 stars7 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Skill to use if user asks you to create a design system or UI kit
SKILL.md
1.2 KB, as published. Nobody here has run it
Create design system
⚠️ STUB — this is a working theory of the skill body. Replace as the implementation is refined.
What we know about it
- It's the skill to invoke when the user asks for a design system or UI kit.
- The skill pairs with an asset-registration mechanism that groups outputs into: Type, Colors, Spacing, Components, Brand — that's the section taxonomy this skill produces against.
Working theory of the body (to be replaced)
- Ask questions (typography direction, palette mood, scale, density, what components are in scope).
- Produce a tokens file (
tokens.cssor similar) with CSS custom properties for: type scale, color ramps, spacing scale, radii, shadows. - Produce one HTML preview file per group (Type, Colors, Spacing, Components, Brand), each registered with
register_assets({ asset, group, viewport }). - Build an index page that pulls them all together.
- Tweakable knobs for the primary token values so the user can riff.
TODO
- Replace this stub with the real skill body once captured.