Design systems · since v1.0.0
AI design system generator
Pick one of the 17 built-in directions — Swiss grid to Night console — or save your own. Either way the design kit compiles it into the rules, tokens and checks the agent designs under.
Why it matters
Without a system, every AI output is a fresh dice roll. A direction in 1DesignTool is executable: it decides spacing scales, type ramps, color rules and motion budget before the agent writes a line, and the gate checks the result against it after. Style stops being a vibe and starts being a contract.
How it works
- 1Choose a directionThe 17 shipped directions span print-inspired grids, quiet luxury, dark consoles, native iOS and more — each a complete visual grammar, not a color preset.
- 2The kit compiles itOn run start, the design kit is copied into the project folder where the agent reads it — direction, tokens, and the checks it will face.
- 3The gate enforces itBefore a result is yours, the gate's automated checks and (in Reviewed/Council) critics verify the build against the direction's own rules.
- 4Save your ownImport a Claude Design export or tune a direction into a named system — it joins the library and applies to any project.
Capabilities
- 17 built-in design directions, each with its own rules and token scale
- Custom systems: save, name and reuse your own direction
- Claude Design exports import directly into the systems library
- Directions are enforced by the gate — spacing, type and color are checks, not suggestions
- Separate 3D direction set for scene work
Without it
Paste a moodboard into the prompt and hope the model remembers it three pages in.
With 1DesignTool
The direction is the kit: written into the project, enforced by the gate, reusable across every template.
FAQ
What are the 17 directions?
Named visual grammars shipped with the kit — Paper and ink, Swiss grid, Calm clinic, Night console, Finance ledger, Playful primary, Quiet luxury, Field notes, Studio bold, Deep space, Civic clear, Market hall, Native iOS, SaaS, Landing page, Internal tool and Colorful.
Can I make my own design system?
Yes — start from a direction, adjust tokens and rules, and save it as a named system. Imported Claude Design exports land in the same library.
How does the agent actually use it?
The design kit is copied into the project folder under the skill paths coding CLIs read (.claude/skills, .agents/skills), so the agent consults it like any project documentation — and the gate verifies it did.
Do directions apply to 3D scenes too?
There's a separate directions3d set — flat low-poly, realistic, stylized character and friends — picked the same way for 3D templates.
In the docs
Related features
Design with the agent you already have.
Free to try, buy once — the studio and your own coding CLIs do the rest.
Download