$ loading_
Use design tokens, component contracts, and self-check HTML quality.
Copy the install command and let the AI configure it · recommended for beginners
Please install the "melta UI" MCP server from askskill: Run: claude mcp add 'io-github-tsubotax-melta-ui' -- npx -y melta-ds-mcp
Using melta UI design tokens and component contracts, generate HTML and styling for a primary button with default, hover, and disabled states, and explain which tokens were used.
Returns button code aligned with melta UI plus state notes and token mappings.
Use melta UI check_html and its rule set to review this HTML, identify issues against component contracts or design rules, and provide a corrected version: <div class="card"><button>Submit</button></div>
Provides a list of issues, reasons for violations, and corrected HTML that better follows the system.
Based on melta UI's 99 rules, tokens, and component contracts, draft an implementation spec for a notification banner component, including structure, states, spacing, colors, and accessibility requirements.
Returns a component spec draft that designers and frontend developers can implement consistently.
Lets AI access design tokens and component contracts via MCP consistently.
Gives AI coding agents queryable design system guidance for accurate implementation.
Build, inspect, audit, and fix UI across frameworks end to end.
Search, read, and discover related design system components via MCP.
Discover design system components and generate implementation-ready frontend code automatically.
Operate design tools remotely for image processing and automated creative workflows.