Vibe is monday.com's open-source design system for React: the components, icons and design tokens behind monday.com, published as
@vibe/core. Its official MCP server gives your coding agent the library's documentation: which components exist, their props, React usage examples, accessibility requirements, the icon set and the design tokens. The agent builds with real Vibe components instead of guessing their API or inventing its own.It's most useful if you build apps for the monday.com marketplace, where matching monday's look matters, or if your team has adopted Vibe as its component library. It also checks a project for the Vibe 2 to Vibe 3 upgrade and generates the migration commands. It runs locally, with no account or API key. If your components live in your own library, Storybook or shadcn/ui does the same job for them.
Prompts to try
Watch out
- It only knows Vibe. On any other stack it has nothing to offer.
- It documents components, it doesn't check the result. Look at the screen with Playwright after the agent builds.
- Run it with
npx -y @vibe/mcpso you get the latest version, since the metadata follows each Vibe release.
Install
Terminal
Loading editor...
claude mcp add vibe -- npx -y @vibe/mcp
In Cursor, add it to
~/.cursor/mcp.json:JSON
Loading editor...
{
"mcpServers": {
"vibe": { "command": "npx", "args": ["-y", "@vibe/mcp"] }
}
}More in Top MCP servers for design.