Box Kite — Claude Code MCP server: what it does, how to install
An offline styling engine and documentation bridge for Box Kite in React. Validates style properties, components, and CSS output directly within coding agents.
claude mcp add mcp -- npx -y @box-kite/mcpWhat Box Kite does
This server exposes six dedicated tools for working with Box Kite React code. Agents can inspect component contracts, check accessibility mappings, and examine exact scale measurements.
The server requires no network access. Everything runs locally from the bundled package engine without state or API keys. You must run Node 22 or higher, because older runtime versions fail when executing the package via npx.
Box Kite silently discards unrecognized styling properties rather than rendering malformed classes. Running prop sets through check_styles lets the agent catch silent styling typos before browser rendering starts.
What it helps with
- verify whether given style props produce valid CSS declarations
- inspect component contracts including keyboard navigation and ARIA attributes
- resolve numeric scaling for spacing, font sizes, and borders
- pull interface layouts such as dashboard shells and data tables
Example prompts for the agent
- Verify whether the property set
p: 4andfontSize: 14creates working CSS viacheck_styles. - Inspect the component contract and accessibility attributes with
get_component. - Look up layout guidelines and nesting rules using
search_docs.
How to install Box Kite
Platform CLI
claude mcp add mcp -- npx -y @box-kite/mcpPlatform CLI
codex mcp add mcp -- npx -y @box-kite/mcpConfig file
{
"mcpServers": {
"mcp": {
"command": "npx",
"args": [
"-y",
"@box-kite/mcp"
]
}
}
}Config file
{
"servers": {
"mcp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@box-kite/mcp"
]
}
}
}Platform CLI
gemini mcp add mcp npx -y @box-kite/mcpStep by step, with commands for each platform: How to add an MCP server to Claude Code, Codex, Cursor, VS Code, Gemini CLI and more
Questions about Box Kite
How to install Box Kite in Claude Code?
Run claude mcp add mcp -- npx -y @box-kite/mcp in your terminal.
What does the Box Kite MCP server do?
It gives coding assistants tools to inspect Box Kite React components, test whether style properties output CSS, and fetch page blocks directly.
Does Box Kite MCP need internet access or API credentials?
It operates strictly offline without API tokens, running all style verification logic through the local bundled package.
