A Model Context Protocol (MCP) server that provides comprehensive information about React design systems, along with code generation capabilities for
A Model Context Protocol (MCP) server that provides comprehensive information about React design systems, along with code generation capabilities for common UI
Compare MCP servers by category, or browse hosted MCP servers if you prefer an endpoint over a local process.
Check the linked publisher documentation and your connected client's tool list. Names and availability can vary with the server version and account permissions.
| Tool | What it does |
|---|---|
| get_component_usage | Get usage guidelines for a specific component with optional section filtering |
| search_usage_guidelines | Search across component usage guidelines with query, section, and component filters |
| compare_components | Compare multiple components and their capabilities |
| generate_layout_code | Generate multi-component layouts |
| get_frontend_setup | Get setup instructions for frontend-code mode |
| get_link_resource | Resolve internal links from usage.md files to appropriate backend resources |
| cloudscape | //usage/{componentId} - Direct access to component usage guidelines in markdown format |
{
"mcpServers": {
"react-design-systems": {
"command": "npx",
"args": [
"@agentience/react-design-systems-mcp"
]
}
}
}Configuration as documented by the project. Restart the client after saving.
Read, search and edit files inside allowed directories with the Model Context Protocol reference Filesystem server.
Retrieve version-aware library documentation and code examples with Context7 MCP, using resolve-library-id and query-docs.
Use Microsoft’s Playwright MCP server to navigate pages, inspect accessibility snapshots, fill forms and capture browser screenshots.
Connect GitHub MCP to repositories, issues and pull requests with GitHub’s hosted service or a locally run server.
Use the Supabase MCP server to inspect database schemas, query project data and retrieve docs through a project-scoped connection.
Search Linear issues and projects, inspect work context and manage updates through Linear’s hosted MCP server with OAuth.