MCP quickstart
MCP server v1.2.0 · 23 tools
Welcome to the Frontend Forever MCP Server documentation. Model Context Protocol (MCP) lets AI agents interface directly with our UI component library — browsing, searching, and retrieving elements, collections, and tags.
1
Get your API Key
Head over to your Developer Settings to generate a personal MCP API key. You'll need a Starter or Super plan.
2
Configure your MCP client
Add the following to your MCP client config (Cursor, Claude Desktop, VS Code, etc.). Replace <your_api_key> with your actual key.
{
"mcpServers": {
"frontendforever": {
"command": "npx",
"args": [
"-y",
"frontendforever-mcp"
],
"env": {
"MCP_API_KEY": "<your_api_key>"
}
}
}
}3
Verify connection
Use the MCP Inspector to verify your server is running and see all available tools:
# Run the MCP Inspector to test your connection
npx @modelcontextprotocol/inspector npx -y frontendforever-mcp
# Then call check_auth from the inspector to confirm your key works