Connections
One connection for the brands and projects you work on
Connect your AI tools to an organization, brand, or project in UI Rules. Tell your agent which brand or project to use within that scope, without switching connections.
Demo video coming soon
A quick look at connecting an AI tool and getting your first on-brand output.
Works with the AI tools you already use
In UI Rules, click Connect, choose your tool and scope, and follow its steps. Sign in when asked. Your guidelines and design tokens stay together in UI Rules.
Adjust project guidelines from your AI tool
With writing enabled, tell your agent which project to use and ask it to add or update a guideline. Review the preview before approving a change.
Ask where you already are
Spot something to fix mid-build and tell your agent, without leaving your editor.
Your project keeps the change
Ask for a project override to keep a change within that project. Brand edits can affect every project that inherits them.
Cursor
Buttons shouldn’t rely on color alone to look clickableUpdating in UI Rules
UI RulesProject updated
Never rely on color alone to signal that a Button is interactive.
Connect your design system through MCP
MCP (Model Context Protocol) is the connection that lets AI tools read information from other apps. UI Rules uses it to share your guidelines, design tokens, and available components with the tools you connect.
Work across brands and projects
Connect an organization or brand over MCP, then tell your agent which brand or project to work on. No connection switching needed.
Choose your tool and sign in
Click Connect in UI Rules, choose your tool and scope, and follow its setup steps. Sign in to your UI Rules account when asked.
Guidelines stay in UI Rules
Maintain your guidelines in UI Rules instead of copying their contents into each project.
Choose whether tools can edit
Turn on Read-only to keep a connection from making changes. With writing enabled, your existing UI Rules permissions still apply.
Control what your connected tools receive
Change it once
Edit a brand guideline or design token in UI Rules.
Share live updates
Tools using the project’s live version pick up your latest guidelines and design tokens.
No files to juggle
Keep shared brand guidance in UI Rules rather than duplicating it across tool-specific files.
Keep a stable version
Pin a project to a saved version when you want to keep in-progress edits separate.
Soon
Built for your shadcncraft library
shadcncraft is our sister library of premium shadcn components and blocks. Connect it and you can attach your own guidelines to each component and choose which blocks each project uses. Own shadcncraft and your Pro trial runs for 30 days instead of 14.
Find your AI tool’s setup guide
Choose the scope that fits your work, then follow the setup steps for your tool. Existing connections need a one-time reconnect for the new sign-in flow.
How the design system MCP connection worksReconnect an existing AI toolReal support when you need it
Stuck on a connection or a rule? Reach us by email or in Discord, and get help from people who use it too.
Get support
Bring your design system into your next build
Connect your tools to the brand guidelines and design tokens your team already uses.