UIMax MCP
About
UIMax MCP — Turns Claude Code into a frontend expert that reviews and fixes your UI automatically. Free for Pro plan users.
Details
- License
- MIT
Explore
- Full automated UI review pipeline (10 steps)
- AST-based code analysis with 25+ anti-pattern rules
- Per-section Report Card with letter grades (A+ through F)
- Auto-saves review history to .uimax-reviews.json
- Competitive benchmarking using compare_sites
- Performance budgets enforcement via .uimaxrc.json
Create a .uimaxrc.json in your project root to customize code analysis and performance budgets:
{
"rules": {
"console-log": "off",
"magic-number": "off",
"hardcoded-color": "warn",
"inline-style": "error"
},
"severity": {
"todo-fixme": "high"
},
"ignore": [
"node_modules",
"dist",
".test.",
".spec."
],
"budgets": {
"lighthouse": {
"performance": 90,
"accessibility": 95,
"bestPractices": 90,
"seo": 90
},
"webVitals": {
"fcp": 1800,
"lcp": 2500,
"cls": 0.1,
"tbt": 300
},
"maxAccessibilityViolations": 0,
"maxCodeIssues": 10
}
}
- rules — Set any rule to "off", "warn", or "error"
- severity — Override severity: "low", "medium", "high", "critical"
- ignore — Additional glob patterns to exclude from analysis
- budgets — Performance thresholds enforced by the check_budgets tool
UIMax searches for .uimaxrc.json in the target directory and up to 3 parent directories, so it works in monorepos.
---
bash
npm install -g uimax-mcp
---
Copy the example workflow to your project:
yamlTurns Claude Code into a frontend expert that reviews and fixes your UI automatically.
<p align="center">
-brightgreen)
</p>
One command — "review my UI at localhost:3000" — and it:
1. Sees your app — captures a real screenshot via Puppeteer
2. Audits accessibility — runs axe-core for WCAG 2.1 violations
3. Runs Lighthouse — real Google Lighthouse scores (Performance, Accessibility, Best Practices, SEO)
4. Measures performance — captures Core Web Vitals (FCP, LCP, CLS, TBT)
5. Audits SEO — 18 checks: meta tags, Open Graph, Twitter cards, structured data, heading hierarchy, canonical URLs
6. Scans your code — AST-based analysis for 25+ anti-patterns across accessibility, design, and code quality
7. Grades everything — per-section Report Card with letter grades (A+ through F) for Accessibility, Performance, Best Practices, SEO, and Code Quality
8. Generates an expert review — Claude acts as a senior frontend engineer with a baked-in review methodology
9. Implements the fixes — edits your actual code files, starting from critical issues down
10. Tracks everything — auto-saves review history so you can see progress over time
Works on any URL — localhost, staging, production. Any site your machine can reach.
Free for all Claude Code users (Pro plan and above). No API keys. No extra costs. Just install and go.
claude mcp add uimax -- npx -y uimax-mcp
---
Quick Start
Install as MCP Server (for Claude Code)
```bash
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.



