Ant Design Components
About
Provides Ant Design component documentation through specialized tools for discovery, exploration, and implementation guidance in React applications
Details
- Author
- hannesj
- Repository
- hannesj/mcp-antd-components
- GitHub stars
- 5
- Categories
- Developer Tools, Design, Workplace, File Management, AI, Search, API, Knowledge Base, Infrastructure
Jump to
- Easy to use - no need to clone the entire Ant Design repository
- Pre-extracted component documentation for faster startup
- List all available Ant Design components
- Get detailed component documentation including descriptions and usage
- View component props and API definitions
- Browse code examples for specific components
- Search for components by name or functionality
Setting up with Highlight
This MCP is not yet compatible with Highlight’s one-click setup. However, you can still use it with Highlight by following these steps:
- Download and install Highlight from highlightai.com/download
- Navigate to the plugins tab and select "Add Custom Plugin"
-
Configure the plugin with the settings below
Plugin Name
Ant Design ComponentsCommand (node, npx, python, etc.)npxArguments-
Argument 1
-y -
Argument 2
mcp-antd-components
Please refer to the README for specific instructions on how to obtain API keys or other required environment variables.
-
Argument 1
- Enable "Start Automatically" if you want the plugin to start when Highlight launches
From the repository
Before using the MCP server for the first time, you need to extract the documentation from the Ant Design repository:
```bash
claude mcp list
list-components
Lists all available Ant Design components in PascalCase format (e.g., Button, DatePicker).
get-component-props
Gets the props and API documentation for a specific component. Use PascalCase names like 'Button'.
get-component-docs
Gets detailed documentation for a specific component. Use PascalCase names like 'DatePicker'.
list-component-examples
Lists all examples available for a specific component. Use PascalCase names like 'Table'.
get-component-example
Gets the code for a specific component example. Component name should be in PascalCase.
search-components
Search for components by name pattern. Works with PascalCase patterns.
Claude Desktop / Cursor
Paste into your MCP client config file to install this server.
{
"mcpServers": {
"ant design components": {
"cwd": "string",
"env": {},
"args": [
"-y",
"mcp-antd-components"
],
"shell": false,
"command": "npx"
}
}
}Linux
{
"cwd": "string",
"env": [],
"args": [
"-y",
"mcp-antd-components"
],
"shell": false,
"command": "npx"
}Macos
{
"cwd": "string",
"env": [],
"args": [
"-y",
"mcp-antd-components"
],
"shell": false,
"command": "npx"
}Windows
{
"env": [],
"args": [
"/c",
"npx",
"-y",
"mcp-antd-components"
],
"command": "cmd"
}Ant Design Components Model Context Protocol Server
A Model Context Protocol (MCP) server that exposes Ant Design component documentation to Large Language Models (LLMs) like Claude. This server allows an LLM to explore and understand Ant Design components through a set of specialized tools.
Features
- Easy to use - no need to clone the entire Ant Design repository
- Pre-extracted component documentation for faster startup
- List all available Ant Design components
- Get detailed component documentation including descriptions and usage
- View component props and API definitions
- Browse code examples for specific components
- Search for components by name or functionality
Initial Setup
Before using the MCP server for the first time, you need to extract the documentation from the Ant Design repository:
```bash
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.
