MCP Server
marmo-ui
io.github.mahmoudilyan/marmo-ui
What this MCP does
Provides a React design-system knowledge base with component documentation, patterns, tenant themes, code generation and validation, prototype sharing, and feedback workflows.
Capabilities
Tools
14
tools
deploy_prototype
Register a prototype for sharing and get a share URL. Reviewers can leave inline comments via the Marmo overlay.
Input schema
{'type': 'object', 'required': ['prototypeId'], 'properties': {'title': {'type': 'string', 'description': 'Human-readable prototype title'}, 'deployUrl': {'type': 'string', 'format': 'uri', 'description': 'Deployed URL if already live'}, 'prototypeId': {'type': 'string', 'description': 'Unique prototype identifier (slug)'}}}
generate_component
Validate and optionally save a custom component for the authenticated tenant. Runs review_generated_code validation before persisting. Use for AI-generated or customized components.
Input schema
{'type': 'object', 'required': ['componentName', 'description', 'code'], 'properties': {'code': {'type': 'string', 'description': 'Generated TSX code using @marmoui/ui primitives'}, 'save': {'type': 'boolean', 'description': 'Save as tenant component override if validation passes'}, 'description': {'type': 'string', 'description': 'What the component should do'}, 'componentName': {'type': 'string', 'description': 'PascalCase component name, e.g. CustomStatCard'}}}
get_agent_connect_config
Returns ready-to-paste MCP configuration for Cursor, Claude Code, or Codex. Use on the Connect page or when setting up a new project.
Input schema
{'type': 'object', 'properties': {'client': {'enum': ['cursor', 'claude', 'codex'], 'type': 'string', 'description': 'Target agent client. Omit to get all configs.'}}}
get_component_info
Get exact props (with types and defaults), code examples, composition patterns, and common mistakes for a single @marmoui/ui component. REQUIRED before using any component for the first time in a session â prevents hallucinated props (e.g. variant="danger" on Badge, size="lg" on Text) that fail at build time.
Input schema
{'type': 'object', 'required': ['componentName'], 'properties': {'componentName': {'type': 'string', 'description': 'Name of the component to get information about (e.g. "Button", "Card", "Input")'}}}
get_design_guidelines
MANDATORY FIRST CALL before writing any @marmoui/ui code in this session. Returns a step-by-step generation checklist (which tools to call, in what order), critical rules (no namespace sub-components, PageSection is self-closing, no Sidebar export), component patterns, and ICON LIBRARY RULES. Pass iconLibrary (default "phosphor"; also "material" | "lucide" | "tabler" | "heroicons" | "feather") to get that library's import source, icon name map, and weight/style mapping â and pass the SAME value to review_generated_code so it enforces it. Ask the user which icon library they want before writing UI code. Call topic="patterns" to get the generation checklist specifically.
Input schema
{'type': 'object', 'properties': {'topic': {'enum': ['all', 'imports', 'styling', 'icons', 'patterns', 'accessibility'], 'type': 'string', 'description': 'Specific guideline topic (default: "all")'}, 'iconLibrary': {'enum': ['phosphor', 'material', 'lucide', 'tabler', 'heroicons', 'feather'], 'type': 'string', 'description': 'Icon library the agent should import from. Default: "phosphor". Ask the user which library they want before writing UI code; if they have no preference, omit this and the default (Phosphor) applies. Supported: phosphor, material, lucide, tabler, heroicons, feather.'}}}
get_design_md
Generate a portable DESIGN.md for the authenticated tenant â brand color, type, tokens, and component inventory â that any AI agent can read to generate on-brand UI. Pass format="markdown" (default) for the DESIGN.md string or format="json" for structured data. Output is deterministic for a given tenant.
Input schema
{'type': 'object', 'properties': {'format': {'enum': ['markdown', 'json'], 'type': 'string', 'default': 'markdown', 'description': 'Output format. "markdown" returns the DESIGN.md string; "json" returns structured data.'}}}
get_knowledge_version
Returns the MCP knowledge version: gitSha, indexedAt, componentCount, patternCount, uptimeSeconds. Call this ONCE per session before generating UI code so you know how fresh the design-system data is. Cheap to call. If gitSha is "unknown" or indexedAt is far in the past, surface that to the user before relying on the data.
Input schema
{'type': 'object', 'properties': {}}
get_pattern
Get a complete, validated composition example for a common UI pattern. Available: app-layouts (ASK USER which of 4 layout ids before any full page), app-shell, confirmation-dialog, dialogs-for-other-actions, data-table-with-filters, form-with-validation, posthog-tracking. Call app-layouts first for full pages â returns layout selection flow + AppLayout usage. Pass iconLibrary (default "phosphor") so the usage note tells you which icon import source to rewrite the pattern's icons to. Returns code + inline validation report. Call with no arguments to list all patterns.
Input schema
{'type': 'object', 'properties': {'patternId': {'type': 'string', 'description': 'Pattern identifier, e.g. "app-shell", "data-table-with-filters", "confirmation-dialog", "dialogs-for-other-actions". Omit to list all available patterns.'}, 'iconLibrary': {'enum': ['phosphor', 'material', 'lucide', 'tabler', 'heroicons', 'feather'], 'type': 'string', 'description': 'Icon library the caller is using. Default: "phosphor". The returned usage note tells the agent which icon import source to use, and the inline validation enforces it. Supported: phosphor, material, lucide, tabler, heroicons, feather.'}}}
get_prototype_feedback
Fetch inline comments from a shared prototype as structured data and Markdown. Pull into Cursor/Claude to iterate on feedback.
Input schema
{'type': 'object', 'required': ['prototypeId'], 'properties': {'prototypeId': {'type': 'string', 'description': 'Prototype ID/slug to fetch feedback for'}, 'includeResolved': {'type': 'boolean', 'default': False}}}
get_tenant_theme
Returns the authenticated tenant's customized theme tokens, CSS variables export, and component overrides. Call after auth to apply tenant-specific styling in generated code.
Input schema
{'type': 'object', 'properties': {}}
list_components
List all available @marmoui/ui components with names, descriptions, categories, and prop counts. Use to discover what exists. Prefer `search_components` when you already know the use case (form, table, dialog, etc.).
Input schema
{'type': 'object', 'properties': {'status': {'type': 'string', 'description': 'Filter by status (e.g., "stable", "beta")'}, 'category': {'type': 'string', 'description': 'Filter by category (e.g., "Components", "Layout")'}}}
review_generated_code
â ï¸ MANDATORY â call this on every piece of code you generate before returning it to the user. Validates TSX/JSX against real @marmoui/ui prop signatures and returns { valid, errors[], warnings[], suggestedFixes[], iconLibrary }. Catches: (1) unknown imports, (2) Tabs.List/Tabs.Trigger namespace misuse â auto-suggests TabsList/TabsTrigger fix, (3) PageSection used as wrapper (must be self-closing), (4) hallucinated props, (5) icons imported from the wrong icon library (pass iconLibrary â default "phosphor" â matching what you passed to get_design_guidelines; wrong-library icon imports are ERRORS). If valid=false, fix all errors and call this again. DO NOT return code with errors to the user.
Input schema
{'type': 'object', 'required': ['code'], 'properties': {'code': {'type': 'string', 'description': 'The complete TSX/JSX code you just generated. Must import from @marmoui/ui.'}, 'context': {'type': 'string', 'description': 'Optional: describe what the code is supposed to do (e.g. "settings page with tabs"). Helps produce more targeted feedback.'}, 'iconLibrary': {'enum': ['phosphor', 'material', 'lucide', 'tabler', 'heroicons', 'feather'], 'type': 'string', 'description': 'Icon library the code must import icons from. Default: "phosphor". Pass the SAME value you passed to get_design_guidelines. When set, imports from any other icon library are reported as ERRORS. Supported: phosphor, material, lucide, tabler, heroicons, feather.'}}}
search_components
Search @marmoui/ui by keyword (e.g. "form", "table", "dialog", "avatar"). Preferred discovery tool â returns the 5-8 most relevant components for a need. Call this before `get_component_info` when unsure which component to use.
Input schema
{'type': 'object', 'required': ['query'], 'properties': {'limit': {'type': 'number', 'description': 'Maximum results to return (default: 10)'}, 'query': {'type': 'string', 'description': 'Search query â\x80\x94 matches against component names, descriptions, categories, and prop names'}}}
validate_component_usage
Validate a TSX/JSX snippet against real @marmoui/ui prop signatures. Returns `{valid, issues[]}`. Prefer `review_generated_code` for post-generation review (it also auto-fixes namespace patterns and suggests related patterns). Use this tool when validating user-provided or existing code rather than newly generated code.
Input schema
{'type': 'object', 'required': ['code'], 'properties': {'code': {'type': 'string', 'description': 'TSX/JSX code snippet to validate against @marmoui/ui'}, 'iconLibrary': {'enum': ['phosphor', 'material', 'lucide', 'tabler', 'heroicons', 'feather'], 'type': 'string', 'description': 'Optional: icon library the code must import icons from. Default: "phosphor". When set, imports from any other icon library are reported as errors. Supported: phosphor, material, lucide, tabler, heroicons, feather.'}}}
History
Recent tool changes
Added
get_prototype_feedback
Sept. 17, 2026, 12:43 p.m.
Added
deploy_prototype
Sept. 17, 2026, 12:43 p.m.
Added
get_agent_connect_config
Sept. 17, 2026, 12:43 p.m.
Added
generate_component
Sept. 17, 2026, 12:43 p.m.
Added
get_design_md
Sept. 17, 2026, 12:43 p.m.
Added
get_tenant_theme
Sept. 17, 2026, 12:43 p.m.
Added
validate_component_usage
Sept. 17, 2026, 12:43 p.m.
Added
review_generated_code
Sept. 17, 2026, 12:43 p.m.
Added
get_pattern
Sept. 17, 2026, 12:43 p.m.
Added
get_component_info
Sept. 17, 2026, 12:43 p.m.
Added
search_components
Sept. 17, 2026, 12:43 p.m.
Added
list_components
Sept. 17, 2026, 12:43 p.m.
Added
get_design_guidelines
Sept. 17, 2026, 12:43 p.m.
Added
get_knowledge_version
Sept. 17, 2026, 12:43 p.m.
Discover
Similar MCP servers
mzizi-mcp
io.github.mzizi-dev/mzizi-mcp
Provides searchable documentation, design tokens, components, accessibility checks, architecture guidance, and agent skills for t…
GripForge
io.github.gripforgeai/mcp
Generates, rigs, animates, analyzes, and packages game characters, weapons, armor, effects, environments, and engine-ready assets.
cypher-mcp
io.github.lonniev/cypher-mcp
Provides named Cypher graph queries and code-orientation tools for tracing capabilities, symbols, invariants, provenance, changes…
spriteship
com.spriteship/spriteship
Generates and manages 2D game characters, assets, animations, tilesets, UI packs, maps, and engine-ready exports for multiple gam…
canton-ccpedia
io.github.UnityNodes/canton-ccpedia
Searches and explains Canton Network and Daml documentation, governance proposals, forums, code examples, APIs, releases, and eco…
ALM X++ MCP Server
io.github.alimbenhelal-pro/alm-xpp-mcp
Supports D365 Finance and Operations development with X++ and AOT search, code analysis, Azure DevOps workflows, telemetry querie…
Kaiku
tech.kaiku/kaiku
Manages team issues, comments, attachments, projects, wiki pages, and related development workflows.
Blixtworks
com.blixtworks.www/tools
Offers pay-per-call utilities for text, image processing and analysis, data conversion, validation, web inspection, cryptography,…