claude mcp add onanc-fragments-mcp -- npx -y @fragments-sdk/mcp
{
"mcpServers": {
"onanc-fragments-mcp": {
"command": "npx",
"args": ["-y", "@fragments-sdk/mcp"]
}
}
}
{
"mcpServers": {
"onanc-fragments-mcp": {
"command": "npx",
"args": ["-y", "@fragments-sdk/mcp"]
}
}
}
{
"mcpServers": {
"onanc-fragments-mcp": {
"command": "npx",
"args": ["-y", "@fragments-sdk/mcp"]
}
}
}
About This MCP Server
The Model Context Protocol server is a design system tool that enables component discovery, rendering, and accessibility auditing, providing a set of 9 tools to support these functions. It is part of the fragments-sdk and can be accessed through the @fragments-sdk/mcp package, connecting to other development tools via npm and stdio. Developers would use this server when building and testing components, particularly when needing to ensure accessibility and proper rendering of design system elements.
Design system MCP with 9 tools for component discovery, rendering, and a11y auditing. This is a Model Context Protocol (MCP) server that extends AI assistants like Claude with developer tools capabilities via the stdio transport.
Package
@fragments-sdk/mcp on npm
HOW TO USE
Select your AI client above to get the install command. This MCP server uses the stdio transport and is available on npm.
What tools does it provide?
The fragments-mcp server extends your AI assistant with developer tools capabilities. Once installed, your AI can use its tools automatically.