Apply your design system guidelines in v0
v0 takes a custom MCP connection with your own headers. Once connected, v0 considers the UI Rules tools in every new chat.
Prerequisites
- A v0 account.
- A UI Rules brand with styles and rules configured.
- A connection key for the project you want to serve. Create one from Connect your AI tools on the project overview.
Add the connection
Open the MCP form
In a new or existing chat, click the + in the chat box, then choose MCPs → Custom MCP.
Fill in the form
- Name:
UI Rules - URL:
https://mcp.uirules.com/mcp
Under Authentication choose Headers, add one header named x-api-key with your connection key as the value, then click Add.
UI Rules appears in your MCP list, and v0 considers its tools in every new chat.
Tell v0 to use it
This step is not optional. Without it, v0 tends to pick its own visual direction before it ever reads your brand.
Open Settings → Preferences → Custom Instructions and paste:
Before any UI work, call the UI Rules MCP tools get_project_notes, then list_rule_areas, then get_design_tokens. Do not generate design inspiration or choose a visual direction; the brand's rules and tokens are the design direction. Run check_rule_compliance at the end and report what it returns.Click Save. The instruction applies to every chat on the account.
Saving can fail silently. An account that is out of credits fails with "Failed to update instructions". Reload the page and check the text is still there before you rely on it.
Troubleshooting
If v0 does not connect or ignores your brand, see Troubleshooting.
