useVyre Context — Claude Code MCP server
This MCP server gives agents useVyre component details, including allowed props, variants, design tokens, and known anti-patterns.
claude mcp add usevyre-context -- npx -y @usevyre/mcp-serverWhat useVyre Context does
useVyre Context connects an MCP client to component knowledge from useVyre. An agent can retrieve a component’s full context, list accepted prop names and values, test one prop value, find a component for a use case, or look up a design token.
The server also exposes anti-patterns, with optional filtering by component, plus package version and context validity details. That gives the agent a check before it writes code with a prop or variant. Claude Code starts it through npx, so the command fails when npx cannot run in the environment.
Ask the agent about a component, token, or UI task to use the server. It can inspect whether error fits the variant prop on Alert, or suggest a component for a keyboard-navigable search box.
What it helps with
- list accepted props for a component
- check a variant before generating code
- validate one prop value
- choose a component for a UI use case
- look up a design token by category
Example prompts for the agent
- List the accepted props and variants for
Button. - Check whether
erroris valid for thevariantprop onAlert. - Suggest a component for a search box with keyboard navigation.
How to install useVyre Context
Platform CLI
claude mcp add usevyre-context -- npx -y @usevyre/mcp-serverPlatform CLI
codex mcp add mcp-server -- npx -y @usevyre/mcp-serverConfig file
{
"mcpServers": {
"mcp-server": {
"command": "npx",
"args": [
"-y",
"@usevyre/mcp-server"
]
}
}
}Config file
{
"servers": {
"mcp-server": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@usevyre/mcp-server"
]
}
}
}Platform CLI
gemini mcp add mcp-server npx -y @usevyre/mcp-serverStep 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 useVyre Context
How do I install useVyre Context in Claude Code?
Run claude mcp add usevyre-context -- npx -y @usevyre/mcp-server. The MCP server will then be available to Claude Code.
What does useVyre Context do?
It gives an agent useVyre component context, including props, variants, design tokens, and anti-patterns. It can also suggest components and check prop values.
Can useVyre Context validate one prop value?
Yes. It checks whether a supplied value is allowed for a particular component prop before code is generated.