Quickstart
This walkthrough takes you from a new account to an AI tool that generates UI on your brand. It covers the happy path. Links in each step go deeper where you need it.
Create your organization
Sign up and create an organization. This is the workspace that holds your brands, teammates, and billing. You can rename it later in settings.
Create a brand
Inside your organization, create a brand. A brand is your design language plus ruleset, and it is the source of truth served to your AI tools.
New brands start on the default theme (an oklch neutral palette with near-black primary and Geist fonts). A dashboard alert prompts you to Import your brand styles until you configure them.
Set your styles
Keep the default styles to get started, or import your own. Paste a CSS theme, or a preset code from a theme builder. See Importing styles for both paths.
You do not have to finish your styles before connecting a tool. You can refine color, typography, spacing, and the rest at any time, and changes flow to your tools automatically.
Author a rule or two
Add a rule or two so your AI tools have explicit guidance to follow. The fastest start is Add starter rules, which offers curated packs; the Agent-ready starter rules pack is a good first one, and it also switches on the Sizing and Layout pages. A rule has text, a Guidance marker (Do, Don't, Caution, or Info), and an Importance (Required, Recommended, or Optional), and it lives in a named group.
For example, you might add a required rule that says to use the brand primary color for primary actions. See Writing rules for the composer.
Connect an AI tool
Create a project for the app you are building (the sidebar footer has New project), then open Connect your AI tools on it and pick your tool: Cursor, Claude, Codex, v0, Lovable, Replit, or Figma Make. The dialog generates a connection key and shows the exact steps for that tool.
The brand overview keeps a setup checklist of these steps, so you can see what is left. For the details, see Connect an AI tool.
Confirm your rules are being served
Back in your tool, ask it to build a piece of UI. The result should reflect your brand styles and honor the rules you authored. If it does, your brand is serving over MCP and you are set.
Once you are moving, ⌘K opens the command menu, which jumps to any page, component, token, or rule from the keyboard.
