Connect any MCP tool to your design system guidelines
If your AI tool is not one of the named guides but can add a remote MCP server, connect it with the server details below. It then reads your brand styles, rules, and component vocabulary like any other connected tool.
Open Connect in the workspace top bar and pick Custom MCP connection, the last entry in the list, for the same details with copy buttons.
Add a remote MCP server in your tool
- Name:
UI Rules - Server URL:
https://mcp.uirules.com/mcp
Sign in
Choose OAuth and connect. Sign in to UI Rules, select your project, and click Authorize.
Use an API key instead
For a tool that needs an API key rather than sign-in, open Use an API key instead in the Connect dialog and click Create API key, or Choose permissions to limit what it can do. The key is shown once. Then add this header in your tool:
- Header:
x-api-key - Value: your key
Treat a key like a password. Never paste a real key into a shared file or a screenshot.
The server is remote, over streamable HTTP, so a tool that only launches local MCP servers cannot connect. See Connect overview for the endpoint and header details, and Troubleshooting if it does not connect.
