Superdesign MCP Server
The Superdesign MCP Server is a design orchestrator that enables AI-powered design generation and management within Claude Code, running entirely locally without requiring API keys.
Core Design Capabilities:
Generate designs - Create UI designs, wireframes, components (HTML/React/Vue), logos, or icons with 1-5 variations from natural language prompts
Iterate designs - Improve existing designs with feedback while maintaining consistency
Extract design systems - Analyze screenshots/images to extract color palettes, typography, spacing, and patterns into reusable JSON design systems
Management Tools:
List designs - View all created designs and design systems in your workspace
Delete designs - Remove specific design files and update metadata
Clean up - Automatically delete designs based on age (default 30 days) or count limits (default 50) with optional dry-run mode
Check file changes - Monitor design file changes for gallery refresh integration
Gallery & Visualization:
Static gallery - Generate an interactive, mobile-responsive HTML gallery with visual previews and full-screen viewing that opens in your browser
Live gallery server - Start a real-time server (default port 3000) with file watching for automatic updates as designs are created
Key Features:
Integrates seamlessly with Claude Code's built-in LLM connection
Organizes designs in structured
superdesign/directoriesProvides detailed specifications following Superdesign's design methodology
Enables natural language design workflows directly in your IDE
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Superdesign MCP Servergenerate a modern dashboard UI with 3 variations"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Superdesign MCP Server
An MCP (Model Context Protocol) server that brings Superdesign - an open source AI design agent by @jasonzhou1993 and @jackjack_eth - to Claude Code as native tools. This server operates as a "design orchestrator" that provides structured specifications for your IDE's LLM to execute, enabling Superdesign's sophisticated design capabilities without requiring Anthropic API keys.
Key Benefits
No API Keys Required: Works directly with Claude Code's built-in LLM connection
Local Execution: Runs entirely on your machine as an MCP server
IDE Integration: Seamlessly integrates with Claude Code (and potentially Cursor, Windsurf, or other MCP-compatible IDEs - untested)
Based on Open Source: Built on top of Superdesign.dev, an open source AI design system
Related MCP server: UI Expert MCP Server
Installation
Install dependencies:
npm installBuild the server:
npm run buildClaude Code Integration
Add the MCP server to your Claude Code configuration:
# Create or edit your Claude Code MCP settings file
# On macOS:
mkdir -p ~/.claude-code
cp claude-mcp-config.json ~/.claude-code/mcp-settings.json
# Or add manually to your existing mcp-settings.json:Example ~/.claude-code/mcp-settings.json:
{
"mcpServers": {
"superdesign": {
"command": "node",
"args": ["/path/to/superdesign/dist/index.js"],
"env": {}
}
}
}Restart Claude Code
The MCP server will provide these Superdesign orchestrator tools in Claude Code:
superdesign_generate- Returns specifications for Claude to generate designssuperdesign_iterate- Returns instructions for Claude to iterate on existing designssuperdesign_extract_system- Returns instructions for design system extractionsuperdesign_list- Lists all created designs in the workspace
Development
Run in development mode:
npm run devSuperdesign Tools Available
superdesign_generate
Returns structured specifications for Claude Code to generate designs:
UI designs: Complete responsive interfaces
Wireframes: Minimal black and white layouts
Components: Individual UI components (HTML/React/Vue)
Logos: SVG logo designs
Icons: SVG icon designs
Parameters:
prompt: Description of what to createdesign_type: Type of design (ui, wireframe, component, logo, icon)variations: Number of variations to generate (1-5, default 3)framework: Framework for components (html, react, vue)
Output: Detailed specifications including Superdesign system prompt, file naming patterns, and design guidelines for Claude Code to execute.
superdesign_iterate
Returns iteration instructions for Claude Code to improve existing designs:
Reads existing design files
Provides structured feedback application guidelines
Maintains design consistency through Superdesign principles
Parameters:
design_file: Path to existing design filefeedback: Improvement instructionsvariations: Number of variations to create
Output: Iteration specifications including original design content, feedback to apply, and Superdesign guidelines for Claude Code to execute.
superdesign_extract_system
Returns instructions for Claude Code to extract design systems from screenshots:
Provides analysis framework for visual design patterns
Guides extraction of color palettes, typography, spacing
Specifies JSON structure for reusable design systems
Output: Extraction specifications and JSON schema for Claude Code to analyze images and create design system files.
superdesign_list
List all Superdesign creations in workspace:
Shows design iterations
Shows extracted design systems
Displays file organization
superdesign_gallery
Generate an interactive HTML gallery to view all designs:
Browser-based gallery - opens in your default browser
Visual previews - see design thumbnails in a responsive grid
Interactive features - click to view full-screen, copy paths
Mobile responsive - works on desktop, tablet, and mobile
Auto-discovery - finds all HTML/SVG files in design_iterations/
Parameters:
workspace_path: Workspace directory (optional, defaults to current directory)
Output: Gallery HTML file with embedded previews and JavaScript interactions. The gallery opens automatically in your browser, providing a Superdesign-like canvas experience.
How the Orchestrator Works
This MCP server operates as a design orchestrator rather than a direct generator:
User Request: "Generate a modern dashboard UI"
MCP Server: Returns detailed specifications with:
Complete Superdesign system prompt and guidelines
Exact file paths and naming conventions
Design type-specific instructions
Number of variations to create
Claude Code: Receives specifications and:
Generates the actual HTML/SVG/React code
Saves files to specified locations
Follows all Superdesign design principles
Usage in Claude Code
Once configured, you can use Superdesign through Claude Code with natural language:
Example Usage:
"Generate a modern dashboard UI design"
"Create 3 variations of a login page wireframe"
"Design a React component for a product card"
"Make a minimalist logo for a tech startup"
"Iterate on the dashboard design with better spacing"
"Show me the gallery of all my designs"
Requirements:
Claude Code with MCP support
No API keys needed (uses Claude Code's existing LLM connection)
File Organization:
Designs are automatically saved to superdesign/ directory (visible folder):
design_iterations/- Generated designs (HTML/SVG files)design_system/- Extracted design systems (JSON files)
Benefits:
No API key configuration required
Uses Claude Code's existing LLM capabilities
Maintains all of Superdesign's sophisticated design methodology
Proper file organization and naming conventions
Full design iteration workflow support
Known Issues & Troubleshooting
File Permissions Error
If you encounter permission errors when running the MCP server:
# Add execute permissions to the built file
chmod +x dist/index.jsMCP Tools Not Appearing
If Superdesign tools don't appear in Claude Code after installation:
Ensure you've completely quit Claude Code (not just closed the window)
Restart Claude Code from your terminal
Verify the server is registered:
claude mcp listCheck the tools are available by asking Claude: "What tools do you have available?"
Server Registration Issues
If the server fails to register:
# Remove and re-add the server
claude mcp remove superdesign -s user
claude mcp add --scope user superdesign /path/to/superdesign/dist/index.jsBuild Errors
Ensure you have Node.js 16+ installed:
node --version # Should be v16.0.0 or higher🤝 Relationship to Superdesign
This MCP server provides a complementary integration for Superdesign by @jasonzhou1993 and @jackjack_eth.
While Superdesign offers an IDE extension that works across multiple editors, this MCP server specifically enhances Claude Code by:
Eliminating the need for API keys - uses Claude Code's built-in LLM connection
Providing native tool integration - no manual prompt copying required
Enabling direct tool calls - seamless workflow without copy/paste
This addresses the community request for Claude Code API provider support (see Superdesign Issue #3).
How it's Different
Aspect | Superdesign Extension | This MCP Server |
Integration Type | IDE Extension | Native MCP Tools |
Claude Code Access | Manual prompt copying | Direct tool invocation |
API Requirements | Separate API key needed | Uses Claude Code's existing connection |
User Experience | Copy/paste workflow | Automated orchestration |
License
This project follows the same license as the original Superdesign project. Please refer to the Superdesign repository for license details.
Available Tools
9 toolssuperdesign_check_filesB
Check for file changes by comparing current files with a manifest (for gallery refresh integration)
| Name | Required | Description | Default |
|---|---|---|---|
| workspace_path | No | Workspace path (defaults to current directory) | |
| manifest | Yes | File manifest to compare against |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It mentions 'check for file changes' and 'comparing,' implying a read-only operation, but doesn't clarify if it modifies files, requires specific permissions, has rate limits, or what the output looks like (e.g., a list of changed files). For a tool with no annotations, this leaves significant gaps in understanding its behavior and safety.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that front-loads the core purpose ('Check for file changes') and adds context ('for gallery refresh integration'). There is no wasted text, and it's appropriately sized for the tool's complexity, making it easy to parse and understand quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity (involving file comparison and integration), lack of annotations, and no output schema, the description is insufficient. It doesn't explain what the tool returns (e.g., a list of changed files, a status), potential side effects, or error conditions. For a tool with no structured behavioral data, more detail is needed to ensure safe and correct usage by an AI agent.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, with clear documentation for both parameters ('workspace_path' and 'manifest'). The description adds minimal value beyond the schema, as it doesn't explain parameter usage, formats, or constraints (e.g., how 'manifest' should be structured beyond the schema). Baseline is 3 since the schema does the heavy lifting, but no extra semantic insights are provided.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Check for file changes by comparing current files with a manifest.' It specifies the verb ('check for file changes') and resource ('files'), and mentions the context ('for gallery refresh integration'). However, it doesn't explicitly differentiate from sibling tools like 'superdesign_list' or 'superdesign_gallery', which might have overlapping file-related functions.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description implies usage in the context of 'gallery refresh integration,' suggesting it's for detecting changes to update a gallery. However, it doesn't provide explicit guidance on when to use this tool versus alternatives (e.g., 'superdesign_list' for listing files or 'superdesign_gallery' for gallery operations), nor does it specify prerequisites or exclusions. The context is clear but lacks comparative guidance.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_cleanupB
Clean up old design files based on age and count limits
| Name | Required | Description | Default |
|---|---|---|---|
| workspace_path | No | Workspace path (defaults to current directory) | |
| max_age_days | No | Delete designs older than X days (default: 30) | |
| max_count | No | Keep only the latest X designs (default: 50) | |
| dry_run | No | Show what would be deleted without actually deleting |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries full burden but only states the cleanup action without detailing behavioral traits. It doesn't disclose whether this is destructive (likely yes, but not confirmed), permission requirements, error handling, rate limits, or what 'clean up' entails (e.g., deletion, archiving). The 'dry_run' parameter hints at safety, but the description itself lacks explicit warnings or operational context.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that front-loads the core purpose without fluff. Every word earns its place by specifying action, target, and criteria concisely, making it easy to parse quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given no annotations and no output schema, this is a potentially destructive tool with 4 parameters. The description is too minimal—it doesn't cover safety aspects (beyond the implied 'dry_run'), expected outcomes, error conditions, or how it interacts with sibling tools. For a cleanup operation, more context on behavior and risks is needed to be complete.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100%, so parameters are well-documented in the schema. The description adds minimal value beyond implying age and count are key criteria, but doesn't explain interactions between parameters (e.g., if both max_age_days and max_count apply) or provide usage examples. Baseline 3 is appropriate as the schema handles most semantics.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('clean up') and target resource ('old design files'), specifying criteria ('based on age and count limits'). It distinguishes from siblings like 'superdesign_list' or 'superdesign_delete' by focusing on automated cleanup with specific thresholds. However, it doesn't explicitly contrast with 'superdesign_delete' which might handle individual deletions.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description implies usage when needing to remove old files automatically, but provides no explicit guidance on when to use this vs. alternatives like 'superdesign_delete' for manual deletion or 'superdesign_list' for inspection. It mentions criteria (age/count) but lacks context about prerequisites, dependencies, or exclusions.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_deleteC
Delete a design file and update metadata
| Name | Required | Description | Default |
|---|---|---|---|
| filename | Yes | Name of the design file to delete | |
| workspace_path | No | Workspace path (defaults to current directory) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It states the tool deletes a file and updates metadata, but doesn't specify whether deletion is permanent or reversible, what metadata is updated, if permissions are required, or error handling. For a destructive operation with zero annotation coverage, this leaves significant gaps in understanding the tool's behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that conveys the core action and an additional effect. It's front-loaded with the primary purpose ('Delete a design file') and avoids unnecessary elaboration. However, it could be slightly more structured by separating the deletion and metadata update aspects for clarity.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity as a destructive operation with no annotations and no output schema, the description is incomplete. It lacks details on behavioral traits (e.g., permanence of deletion, error responses), usage context, and output expectations. For a mutation tool with significant implications, more comprehensive information is needed to guide safe and effective use.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100%, so the schema already documents both parameters ('filename' and 'workspace_path') with clear descriptions. The description doesn't add any parameter-specific details beyond what the schema provides, such as file format constraints or path examples. Baseline 3 is appropriate when the schema handles parameter documentation effectively.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('Delete') and resource ('a design file'), and mentions an additional effect ('update metadata'). It distinguishes from siblings like 'superdesign_list' or 'superdesign_generate' by specifying deletion rather than listing or creation. However, it doesn't explicitly differentiate from 'superdesign_cleanup', which might also involve deletion operations.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
No guidance is provided on when to use this tool versus alternatives. The description doesn't mention prerequisites, when not to use it, or compare it to sibling tools like 'superdesign_cleanup' that might handle deletion differently. Usage context is implied but not explicitly stated.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_extract_systemC
Returns instructions for extracting design system from screenshot or image
| Name | Required | Description | Default |
|---|---|---|---|
| image_path | Yes | Path to screenshot/image to extract design system from |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It states this is a read operation ('Returns instructions'), which is clear, but lacks details on permissions, rate limits, output format, or any side effects. For a tool with zero annotation coverage, this leaves significant gaps in understanding its behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that directly states the tool's purpose without unnecessary words. It is appropriately sized and front-loaded, making it easy to understand at a glance with zero waste.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given no annotations and no output schema, the description is incomplete for a tool that returns instructions. It doesn't explain what the instructions entail, their format, or any behavioral traits. For a tool with this complexity and lack of structured data, the description should provide more context to be fully helpful.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The schema description coverage is 100%, with the single parameter 'image_path' well-documented in the schema. The description adds no additional meaning beyond what the schema provides, such as supported image formats or constraints. Baseline 3 is appropriate as the schema handles parameter documentation adequately.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('Returns instructions') and target resource ('extracting design system from screenshot or image'), making the purpose immediately understandable. However, it doesn't differentiate from sibling tools like 'superdesign_generate' or 'superdesign_iterate' which might also involve design system operations, missing explicit sibling distinction.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
No guidance is provided on when to use this tool versus alternatives like 'superdesign_generate' or 'superdesign_iterate'. The description implies usage for extracting from images but doesn't specify prerequisites, exclusions, or comparative contexts with other tools in the server.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_galleryC
Generate an HTML gallery to view all designs in a browser
| Name | Required | Description | Default |
|---|---|---|---|
| workspace_path | No | Workspace path (defaults to current directory) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It states the tool generates an HTML gallery but doesn't cover critical aspects like whether it's read-only or destructive, what permissions are needed, how it handles errors, or the format of the output. This leaves significant gaps for a tool that likely creates files or displays data.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that directly states the tool's function without any wasted words. It's front-loaded with the core action and resource, making it easy to parse quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity of generating an HTML gallery (which likely involves file creation or data display), the lack of annotations, no output schema, and incomplete behavioral details, the description is insufficient. It doesn't explain what the output looks like, potential side effects, or how it integrates with other tools, leaving the agent under-informed.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 1 parameter with 100% description coverage, so the schema already documents 'workspace_path' thoroughly. The description adds no additional meaning or context about parameters beyond what's in the schema, resulting in a baseline score of 3 as the schema does the heavy lifting.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose with a specific verb ('Generate') and resource ('HTML gallery'), and specifies what it displays ('all designs in a browser'). However, it doesn't explicitly differentiate from sibling tools like 'superdesign_live_gallery' or 'superdesign_list', which might have overlapping functionality.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives. It doesn't mention any context, prerequisites, or exclusions, such as how it differs from 'superdesign_live_gallery' or 'superdesign_list', leaving the agent with no usage direction.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_generateC
Returns design specifications for Claude Code to generate UI designs, wireframes, components, logos, or icons
| Name | Required | Description | Default |
|---|---|---|---|
| prompt | Yes | Design prompt describing what to create | |
| design_type | Yes | Type of design to generate | |
| variations | No | Number of design variations to create | |
| framework | No | Framework for UI components | html |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It states the tool 'Returns design specifications' but doesn't clarify what that entails—e.g., whether it's a read-only operation, if it creates new files, rate limits, authentication needs, or what the output looks like. For a tool with no annotations, this leaves significant gaps in understanding its behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that front-loads the core purpose without unnecessary words. It directly states what the tool does ('Returns design specifications') and the scope ('for Claude Code to generate UI designs, wireframes, components, logos, or icons'), making it easy to parse quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity (4 parameters, no output schema, no annotations), the description is incomplete. It doesn't address behavioral aspects like whether this tool creates or modifies files, what the output format is, or how it interacts with siblings. For a design generation tool with multiple parameters and no structured output information, more context is needed to be fully helpful.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100%, meaning all parameters are documented in the schema. The description doesn't add any parameter-specific details beyond what's in the schema (e.g., it doesn't explain how 'prompt' should be formatted or the implications of 'design_type' choices). With high schema coverage, the baseline score is 3, as the description doesn't compensate but also doesn't detract.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Returns design specifications for Claude Code to generate UI designs, wireframes, components, logos, or icons.' It specifies the verb ('Returns design specifications') and the resource/scope (various design types). However, it doesn't explicitly differentiate from sibling tools like superdesign_iterate or superdesign_gallery, which might have overlapping functionality.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives. It doesn't mention prerequisites, when-not-to-use scenarios, or how it differs from siblings such as superdesign_iterate (which might be for iterative design) or superdesign_gallery (which might list existing designs). Usage is implied by the purpose but not explicitly stated.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_iterateC
Returns iteration instructions based on existing design and feedback
| Name | Required | Description | Default |
|---|---|---|---|
| design_file | Yes | Path to existing design file to iterate on | |
| feedback | Yes | Feedback for improving the design | |
| variations | No | Number of design variations to create |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It mentions returning 'iteration instructions' but doesn't specify what these instructions entail (e.g., text descriptions, code snippets, or structured data), whether it's a read-only or mutating operation, or any constraints like rate limits or authentication needs. This leaves significant gaps for an agent to understand the tool's behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that front-loads the core action ('Returns iteration instructions') and includes essential context ('based on existing design and feedback'). There is no wasted verbiage, and every word contributes to understanding the tool's purpose.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity of a design iteration tool with 3 parameters, no annotations, and no output schema, the description is insufficient. It doesn't explain the output format (what 'iteration instructions' look like), error conditions, or behavioral traits like whether it modifies files or is idempotent. This leaves the agent with critical unknowns for proper invocation.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, providing clear details for all parameters (design_file, feedback, variations). The description adds minimal value beyond the schema by implying that 'feedback' is used for 'improving the design', but it doesn't explain parameter interactions or provide additional context like format examples. This meets the baseline for high schema coverage.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose with a specific verb ('Returns') and resource ('iteration instructions'), and it specifies the inputs ('based on existing design and feedback'). However, it doesn't explicitly differentiate from sibling tools like 'superdesign_generate' or 'superdesign_extract_system', which might have overlapping functions.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives. It doesn't mention prerequisites (e.g., needing an existing design file), exclusions, or comparisons to siblings like 'superdesign_generate' for new designs or 'superdesign_extract_system' for analysis.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_listC
List all created designs in the workspace
| Name | Required | Description | Default |
|---|---|---|---|
| workspace_path | No | Workspace path (defaults to current directory) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It mentions listing designs but doesn't cover critical aspects like whether this is a read-only operation, pagination behavior, error conditions, or performance characteristics. For a list tool with zero annotation coverage, this leaves significant gaps.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that states the tool's purpose without any unnecessary words. It's appropriately sized for a simple list operation and front-loaded with the essential information.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the lack of annotations and output schema, the description is insufficiently complete. It doesn't explain what the return format looks like (e.g., list of design objects, pagination details), error handling, or how it differs from similar sibling tools. For a tool with no structured metadata, the description should provide more context.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The schema description coverage is 100%, with the single parameter 'workspace_path' well-documented in the schema. The description doesn't add any additional parameter information beyond what the schema already provides, so it meets the baseline score when the schema does the heavy lifting.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the verb ('List') and resource ('all created designs in the workspace'), making the purpose unambiguous. However, it doesn't differentiate from sibling tools like 'superdesign_gallery' which might also list designs, so it doesn't reach the highest score.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
No guidance is provided on when to use this tool versus alternatives like 'superdesign_gallery' or 'superdesign_check_files'. The description only states what it does, not when it's appropriate or what prerequisites might exist.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
superdesign_live_galleryC
Start a live gallery server with real-time updates and file watching
| Name | Required | Description | Default |
|---|---|---|---|
| workspace_path | No | Workspace path (defaults to current directory) | |
| port | No | Port for the live gallery server (default: 3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. While it mentions 'real-time updates and file watching' as features, it doesn't describe what the server does (e.g., serves files, provides a web interface), how it handles errors, whether it runs in the background, or what happens when it starts (e.g., opens a browser). For a server-starting tool with zero annotation coverage, this leaves significant behavioral gaps.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that front-loads the core action ('Start a live gallery server') and adds key features. There's no wasted text, and it's appropriately sized for the tool's complexity. However, it could be slightly more structured by separating purpose from features for better readability.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool starts a server (a complex operation) with no annotations and no output schema, the description is incomplete. It doesn't explain what the server outputs (e.g., a URL, status messages), how to interact with it, or what 'real-time updates' entail. For a tool of this nature, more context on behavior and results is needed to be fully helpful to an AI agent.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, with clear documentation for both parameters ('workspace_path' and 'port'), including defaults. The description doesn't add any parameter-specific information beyond what's in the schema, such as format details or constraints. With high schema coverage, the baseline score of 3 is appropriate as the schema handles the parameter semantics adequately.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose with a specific verb ('Start') and resource ('live gallery server'), and mentions key features ('real-time updates and file watching'). It distinguishes itself from sibling tools like 'superdesign_gallery' by specifying it's a 'live' server. However, it doesn't explicitly differentiate from all siblings in terms of scope or functionality.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives. It doesn't mention when this tool is appropriate compared to siblings like 'superdesign_gallery' (which might be a static gallery) or 'superdesign_iterate' (which might involve iterative processes). There's no information about prerequisites, dependencies, or typical use cases.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections. Dates show when Glama detected each change.
9 tool updates
- First observed
superdesign_check_files - First observed
superdesign_cleanup - First observed
superdesign_delete - First observed
superdesign_extract_system - First observed
superdesign_gallery - First observed
superdesign_generate - First observed
superdesign_iterate - First observed
superdesign_list - First observed
superdesign_live_gallery
TDQS
Each tool has a clearly distinct purpose with no ambiguity: checking files, cleaning up, deleting, extracting systems, generating galleries, generating designs, iterating, listing, and live galleries. The descriptions clearly differentiate their functions, such as 'superdesign_generate' for creating designs versus 'superdesign_iterate' for refining them, preventing misselection.
All tool names follow a consistent 'superdesign_' prefix with a descriptive verb_noun pattern (e.g., superdesign_check_files, superdesign_generate). There are no deviations in style or convention, making the naming predictable and easy to understand across the set.
With 9 tools, the count is well-scoped for a design-focused server, covering key operations like creation, iteration, listing, and cleanup. Each tool earns its place by addressing specific aspects of the design workflow, avoiding bloat or thin coverage.
The tool set provides comprehensive coverage for design workflows, including create (generate), read (list, gallery), update (iterate), and delete (delete, cleanup), with additional utilities like file checking and live galleries. A minor gap exists in direct update or metadata management tools, but agents can work around this using iteration and deletion.
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Connectors
Build and manage your design system with AI: tokens, themes, components, icons, Figma and code.
UI design from prompts, screenshots, and URLs for AI coding agents and theme tokens.
Turn any live website into brand colors, fonts, design tokens, SVGs, Lottie and paste-ready code.
AI-powered design and management for Webflow Sites
Related MCP Servers
- AlicenseCqualityDmaintenanceEnables Claude Desktop and other AI tools to interact directly with Figma, allowing for powerful AI-assisted design capabilities through natural language commands.92299653MIT
- AlicenseBqualityDmaintenanceProvides professional UI/UX design expertise and frontend development tools for analyzing interfaces, generating design systems, and creating modern components with accessibility and best practices built-in. Supports React, Vue, Angular and other frameworks with seamless Claude Code CLI integration.422MIT
- AlicenseNot gradedqualityDmaintenanceEnables AI assistants like Claude Desktop to interact directly with Figma, allowing natural language commands to create, modify, and analyze designs including shapes, text, components, and layouts in real-time.MIT
- FlicenseBqualityFmaintenanceEnables bidirectional control between Claude Code and Figma with real-time sync, allowing creation and manipulation of design elements, component management, and document inspection through natural language commands.504-
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/jonthebeef/superdesign-mcp-claude-code'
If you have feedback or need assistance with the MCP directory API, please join our Discord server