Turn any live website into brand colors, fonts, design tokens, SVGs, Lottie and paste-ready code.
MCPpedia last refreshed this data
app.miromiro/miromiro is an MCP server that turn any live website into brand colors, fonts, design tokens, SVGs, Lottie and paste-ready code. Its tool list has not been published yet, requires no API key, and scores 85/100 on MCPpedia's security, maintenance and efficiency rubric.
Config is the same across clients — only the file and path differ.
{
"mcpServers": {
"miromiro": {
"env": {
"MIROMIRO_API_KEY": "mm_live_your_key"
},
"args": [
"-y",
"miromiro-mcp"
],
"command": "npx"
}
}
}Are you the author?
Add this badge to your README to show your security score and help users find safe servers.
MCP server for the MiroMiro design-extraction API. Give your AI agent the real design of any live website - brand colors, fonts, design tokens, SVGs, images, Lottie animations, and paste-ready component code - so it builds from actual values instead of guessing from a screenshot.
Run this in your terminal to verify the server starts. Then let us know if it worked — your result helps other developers.
npx -y 'miromiro-mcp' 2>&1 | head -1 && echo "✓ Server started successfully"
After testing, let us know if it worked:
Five weighted categories — click any category to see the underlying evidence.
No known CVEs.
Checked miromiro-mcp against OSV.dev.
Click any tool to inspect its schema.
Be the first to review
Have you used this server?
Share your experience — it helps other developers decide.
Sign in to write a review.
Others in design / marketing
AI-native design editor. Open-source Figma alternative.
DataForSEO API modelcontextprotocol server
AI image generation and editing with prompt optimization and quality presets. Powered by Nano Banana
Draw and visually collaborate with your agents on tldraw's canvas.
MCP Security Weekly
Get CVE alerts and security updates for app.miromiro/miromiro and similar servers.
Start a conversation
Ask a question, share a tip, or report an issue.
Sign in to join the discussion.
MCP server for the MiroMiro design-extraction API. Give your AI agent the real design of any live website - brand colors, fonts, design tokens, SVGs, images, Lottie animations, and paste-ready component code - so it builds from actual values instead of guessing from a screenshot.
Works with Claude (web, desktop, Claude Code), ChatGPT, Cursor, Windsurf, Codex, and any MCP client.
Install as a plugin to get the tools plus three skills that teach Claude when to reach for
each one (clone-section, match-brand, extract-assets):
claude plugin marketplace add anthropics/claude-plugins-community
claude plugin install miromiro@claude-community
The plugin uses the remote server, so there is nothing to install and no key to paste - on first use it opens a one-click MiroMiro sign-in that links a free account (300 credits/month, no card).
A hosted server lives at:
https://miromiro.app/mcp
Paste that URL into any client that accepts a remote MCP server. On first use it opens a one-click MiroMiro sign-in that links a free account (300 credits/month, no card).
{ "mcpServers": { "miromiro": { "url": "https://miromiro.app/mcp" } } } to ~/.cursor/mcp.json.?access_key=mm_live_... to the URL, or send it as an Authorization: Bearer header.Prefer a local stdio process with the key in an env var? Get a free key at miromiro.app/api/dashboard, then:
Cursor (~/.cursor/mcp.json) / Windsurf (Settings → MCP):
{
"mcpServers": {
"miromiro": {
"command": "npx",
"args": ["-y", "miromiro-mcp"],
"env": { "MIROMIRO_API_KEY": "mm_live_your_key" }
}
}
}
Claude Code (run in your terminal, not inside a claude session):
claude mcp add miromiro -s user \
--env MIROMIRO_API_KEY=mm_live_your_key \
-- npx -y miromiro-mcp
| Tool | What it returns | Credits |
|---|---|---|
extract_code | A section of a live page as a paste-ready component (Tailwind, HTML+CSS, JSX or Vue) plus the tokens it uses - start here to rebuild real UI | 25 |
extract_brand | Named color roles (primary/accent/background/text), palette, fonts split by role, logo, social profiles, a 0-1 confidence score, and signals explaining where the colors came from (declared tokens vs inferred) | 15 |
extract_design_tokens | Full token system with usage counts; format: css or tailwind for paste-ready output, dtcg for a W3C Design Tokens file (Style Dictionary / Figma variables) | 10 |
extract_fonts | Every font file and family the site loads, with weights, formats, and file URLs | 5 |
extract_videos | Video files, og:video, and player embeds (YouTube, Vimeo, Wistia, Loom), tagged by source | 1 |
extract_audio | Audio files, og:audio, and podcast enclosures, tagged by source | 1 |
extract_lottie | Lottie animation JSON files declared in the page | 3 |
extract_svgs | Inline SVG code (sanitized, paste-ready) plus external SVG file URLs | 1 |
extract_assets | Every image URL on a page, tagged by source, with alt text | 1 |
All tools are read-only and retry-safe. Identical calls within 24 hours are served from cache for free, and failed calls are never billed.
extract_code takes section - one of