Quickstart: from design system to governed AI
Run the whole loop in about ten minutes: connect a system, structure it into rules, install preset in your AI coding tool, and watch it catch drift.
preset AI sits between your design system and the AI tools generating UI from it. This is the whole loop: connect → structure → install → observe. Each step has its own guide if you want more depth; this is the ten-minute version.
Connect your system
Point preset at a repository or a token source. It reads your tokens, components, and patterns and keeps its own copy in sync. Your source of truth stays where it lives today. See Connect your design system.
Structure it into rules
A system describes what exists. Rules describe what to do about it: what is forbidden, what is suggested, what gets resolved automatically. preset can scan and seed a starting set; you confirm and adjust. This is what your agent defers to. See Turn your system into rules.
Install for your AI coding tool
Connect Claude Code, Cursor, or Codex to the preset gateway over OAuth. Now the agent reads your system and its rules before it writes a line of UI. See Install preset in your AI coding tool.
Watch it catch drift
Ask your agent to build something. preset validates the result against your rules in real time, and surfaces drift as the system and its usage pull apart. This is the moment the loop closes: generated UI that defers to your system, with violations caught. See Catch drift from AI-generated UI.
Where next
Once the loop is running, the per-step guides go deeper, and the full reference covers every option. If you only do one thing first, connect a system and install for one tool. The rest follows from there.