io.github.Forge-Space/ui-mcp

Registre officiel Archivé Autres

Forge Space MCP server for UI and backend generation via stdio transport.

Installation

Ajoutez ceci à la configuration MCP de votre client (Claude Desktop : claude_desktop_config.json ; Cursor : .cursor/mcp.json ; VS Code et les autres utilisent la même forme « mcpServers »).

NPM package @forgespace/ui-mcp
Claude Code
claude mcp add ui-mcp -- npx -y @forgespace/ui-mcp@0.25.0
Configuration JSON (Claude Desktop, Cursor, VS Code)
{
    "mcpServers": {
        "ui-mcp": {
            "command": "npx",
            "args": [
                "-y",
                "@forgespace/ui-mcp@0.25.0"
            ]
        }
    }
}

Documentation

Tirée du README du projet sur GitHub, actualisée chaque semaine. Les liens ouvrent GitHub.

Sommaire
  1. @forgespace/ui-mcp
  2. Architecture
  3. Quick Start
  4. Tools
  5. Framework & Library Support
  6. Brand Identity Integration
  7. Environment Variables
  8. Distribution
  9. Development
  10. Community
  11. GitHub Workflow
  12. License

@forgespace/ui-mcp

AI-driven UI and backend code generation via Model Context Protocol. 22 tools, 5 frameworks, brand-aware, npm-published, and MCP Registry-ready.

Part of the Forge Space ecosystem.

Architecture

@forgespace/ui-mcp is a thin protocol adapter. All AI/generation logic lives in @forgespace/siza-gen:

@forgespace/ui-mcp (~355 KB)       @forgespace/siza-gen (~1.8 MB)
├── src/index.ts (MCP server)      ├── ml/        (embeddings, quality, training)
├── tools/     (22 tool defs)      ├── generators/ (react, vue, angular, svelte, html)
├── services/  (figma, analysis)   ├── registry/   (502 snippets, compositions, packs)
├── resources/ (MCP resources)     ├── feedback/   (self-learning, pattern promotion)
└── lib/       (browser, image)    └── quality/    (anti-generic rules, diversity)

Quick Start

# NPX (instant)
npx -y @forgespace/ui-mcp@latest

# Global install
npm install -g @forgespace/ui-mcp && forgespace-ui-mcp

# Docker
docker build -t forgespace-ui-mcp . && docker run --rm -i forgespace-ui-mcp
IDE Integration

Add to your MCP configuration (Claude Code, Windsurf, Cursor, VS Code):

{
  "mcpServers": {
    "forgespace-ui-mcp": {
      "command": "npx",
      "args": ["-y", "@forgespace/ui-mcp@latest"],
      "env": {
        "FIGMA_ACCESS_TOKEN": "your_token_here"
      }
    }
  }
}

Tools

ToolCategoryDescription
scaffold_full_applicationCodeFull project boilerplate (React/Next.js/Vue/Angular/HTML + Tailwind)
generate_ui_componentCodeUI components with style audit, supports shadcn/ui, Radix, Headless UI, Material, PrimeVue
generate_formCodeProduction forms with Zod/Yup validation, multi-step flows, accessible markup
generate_page_templateCodePre-built pages (landing, dashboard, auth, pricing, CRUD)
generate_prototypeDesignInteractive HTML prototypes with navigation
generate_design_imageDesignSVG/PNG mockups of UI screens
image_to_componentCodeScreenshot/wireframe to framework-specific component
refine_componentCodeImprove components via natural language feedback
generate_api_routeBackendAPI routes with validation, auth, and error handling
generate_backend_moduleBackendFull feature modules with routes, services, middleware
scaffold_backendBackendComplete backend projects with auth, DB, monitoring
generate_from_template_packCodeMulti-page apps from curated packs (SaaS, Landing, AI Chat)
figma_context_parserContextRead Figma files, extract tokens, map to Tailwind
figma_push_variablesDesignWrite design tokens back to Figma
fetch_design_inspirationContextExtract visual metadata from URLs
analyze_design_referencesContextAnalyze design references, detect patterns
analyze_design_imageMLAnalyze design images for training data
analyze_component_libraryContextAnalyze component library patterns
audit_accessibilityQualityWCAG 2.1 audit with fix suggestions
submit_feedbackQualitySubmit feedback to improve future output
payments_refundBackendRequest payment refund with Zod-validated params (payment_id, amount, reason, currency)
manage_trainingMLTraining data ingestion and fine-tuning

Framework & Library Support

LibraryReactVueAngularSvelteHTML
shadcn/uishadcn/uishadcn-vueTailwindbits-uiTailwind
Radix@radix-ui/react@radix-ui/vueTailwind@radix-ui/svelteTailwind
Headless UI@headlessui/react@headlessui/vueTailwind@headlessui/svelteTailwind
Material@mui/materialVuetify@angular/material@smui/materialTailwind
PrimeVueHeadless UIprimevueprimengTailwindTailwind
noneTailwind CSSTailwind CSSTailwind CSSTailwind CSSTailwind CSS

Brand Identity Integration

All generation tools accept an optional brand_identity parameter — a JSON string from branding-mcp's generate_brand_identity tool. When provided, brand colors, typography, and spacing are injected into the design context.

Environment Variables

VariableRequiredDescription
FIGMA_ACCESS_TOKENOnly for Figma toolsToken from Figma Settings
SENTRY_DSNOptionalSentry DSN for error reporting (uncaught exceptions and unhandled rejections)

Distribution

  • npm — published as @forgespace/ui-mcp
  • MCP Registry metadata — repository includes server.json and mcpName metadata for registry submission
  • Tag release automation — pushing v* runs npm publish with provenance, then publishes the same version to the MCP Registry via GitHub OIDC
  • Weekly registry ops — .github/workflows/mcp-registry-status.yml refreshes one issue with npm and MCP Registry drift, visibility, and next actions
  • GitHub — source, issues, releases, and Discussions live under Forge Space

Development

npm install && npm run build
npm test                  # 437 tests, 35 suites
npm run validate          # lint + format + typecheck + test

Community

GitHub Workflow

This repository follows the shared Forge Space GitHub work-management baseline:

  • Discussions for ideas, RFCs, Q&A, and announcements
  • Issues for actionable delivery work
  • Projects for roadmap visibility and cross-repo reporting

See Forge-Space/.github GOVERNANCE.md for the org-wide contract.

Scheduled monitoring runs that execute CodeQL require job-scoped security-events: write permission for SARIF upload.

The scheduled Security Monitoring workflow intentionally skips Codecov upload and relies on local coverage summary generation to reduce false alerting from third-party action download instability.

License

MIT

Questions fréquentes

Qu'est-ce que io.github.Forge-Space/ui-mcp ?

Forge Space MCP server for UI and backend generation via stdio transport.

Comment installer io.github.Forge-Space/ui-mcp ?

Il s'exécute sur votre machine. Dans Claude Code : claude mcp add ui-mcp -- npx -y @forgespace/ui-mcp@0.25.0. Pour les autres clients, collez la configuration JSON de cette page dans leurs réglages MCP.

Faut-il une clé API pour io.github.Forge-Space/ui-mcp ?

Son entrée au registre n'indique aucune clé ni secret obligatoire. Certaines fonctions peuvent tout de même demander un compte auprès du service auquel il se connecte.

io.github.Forge-Space/ui-mcp est-il open source ?

Oui. Son code est sur GitHub sous licence MIT.

Qui maintient io.github.Forge-Space/ui-mcp ?

Il est publié par Forge-Space. AI.tn le référence sans le maintenir ni le recommander.

Issu du registre MCP officiel. Être listé n'est pas une recommandation : vérifiez le code et les permissions d'un serveur avant de lui donner accès à vos données.