frontend-dev-mcp 0.1.2

Frontend Development MCP Server

Frontend Development MCP Server

Model Context Protocol (MCP) server built with FastMCP for frontend development workflows.

PyPI package: frontend-dev-mcp 0.1.2

Features & Tools

• get_design_system_guide(type): Pros/cons of design systems ('utility-first', 'component-library', 'headless').
• get_color_palette(primary_hex): Generate full complementary and analogous color palettes.
• get_accessibility_checklist(): Essential a11y checklist.
• get_performance_tips(focus_area): Performance tips for 'images', 'javascript', or 'css'.
• get_agent_skill(skill_name): Reads agent instructions locally from .agents/skills.
• ask_gemini_cli(prompt): Calls local gemini CLI securely via subprocess (no API key stored in code). Forces short outputs using "caveman mode".

Prompts

• frontend_project_kickoff: Interactive checklist to plan new architectures.

Install

Requires Python 3.12+ and uv.

Option 1 — run without installing (recommended):

uvx --from frontend-dev-mcp==0.1.2 frontend-mcp

Option 2 — install globally:

uv tool install frontend-dev-mcp==0.1.2
frontend-mcp

Connect to MCP Client (Claude Desktop, Cursor, etc.)

Add this to your MCP config (e.g. claude_desktop_config.json):

{
  "mcpServers": {
    "frontend-dev-server": {
      "command": "uvx",
      "args": [
        "--from",
        "frontend-dev-mcp==0.1.2",
        "frontend-mcp"
      ],
      "env": {}
    }
  }
}

If you installed with uv tool install, you can use the command directly:

{
  "mcpServers": {
    "frontend-dev-server": {
      "command": "frontend-mcp",
      "args": [],
      "env": {}
    }
  }
}

Testing via Inspector

npx @modelcontextprotocol/inspector uvx --from frontend-dev-mcp==0.1.2 frontend-mcp

Local development

Clone this repo and run from source:

uv run server.py