Ui Mcp

io.github.Forge-SpacePublished by GitHub account Forge-Spacev0.25.0Updated Oct 24, 2026

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

VerifiedSTDIODesktop onlyDeveloper ToolsMedia & Design

Overview

AI-generated overview

Local MCP server that generates UI components, pages, prototypes and backend code across React, Vue, Angular, Svelte and HTML, with Figma and design-analysis…

What you can do
  • Scaffold full frontend projects and multi-page apps from template packs
  • Generate UI components, forms, page templates and interactive prototypes, and refine them from natural-language feedback
  • Generate API routes, backend modules and complete backend projects
  • Read Figma files and tokens, push design tokens back to Figma, and analyze design references and component libraries
  • Audit accessibility against WCAG 2.1, analyze design images, manage training data and submit feedback
When to use it
Useful when you want an assistant to bootstrap or extend a web project: producing boilerplate, components, forms, pages or backend scaffolding in a chosen framework, or turning Figma designs and screenshots into code.
Requirements
Runs locally over stdio, typically via npx or a global npm install (Node.js required); Docker is also documented. FIGMA_ACCESS_TOKEN is needed only for the Figma tools; SENTRY_DSN is optional for error reporting. No authentication is declared in the manifest.
Before you install
The Figma tools need a Figma access token, and figma_push_variables writes design tokens back into Figma files. A payments_refund tool is listed, so review what it actually does before use. Generated code and design data are produced by the bundled generation package, and optional Sentry reporting sends error data to a third party.

Installation

In SourceWeft

  1. Open Ui Mcp in the dashboard and add it to a workspace.
  2. Enable the server for the chats that should use its tools.

Desktop only via STDIO. STDIO servers start a local process, so they need the SourceWeft desktop host.

Other MCP clients

Follow the launch instructions in the repository.

README

[Forge Space]

@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.

[npm version] [CI] [Coverage] [License: MIT] [TypeScript] [MCP] [Node.js]

Part of the Forge Space ecosystem.

[Siza Capabilities]

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

bash
# NPX (instant)npx -y @forgespace/ui-mcp@latest
# Global installnpm install -g @forgespace/ui-mcp && forgespace-ui-mcp
# Dockerdocker 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):

json
{  "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

bash
npm install && npm run buildnpm test                  # 437 tests, 35 suitesnpm 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

Source: README.md at commit 135a273

Tools

0
SourceWeft has not started this package in its sandbox yet, so its tools are not known.

Version history

1
  1. v0.25.0LatestSep 16, 2026

Score

50% of the applicable checks met

How complete this listing is, computed from the registry entry, the endpoint and public sources. Not a rating of the server and not a statement that it is safe or working today: reachability is a dated check, and no installs or reviews go into the score.

  • Reached in the last 30 days25 pts

    Keep the endpoint answering the MCP handshake; SourceWeft probes it every 30 days.

  • Auth declared10 pts

    Declare the credential headers in the registry entry, or keep the endpoint answering the probe so its auth can be classified.

  • Tools listed15 pts

    Answer tools/list without a credential, or ship a package that starts in a sandbox without one.

  • DescriptionRequired15 pts
  • Logo10 pts
  • Documentation15 pts
  • License10 pts