mcp-uimax
Runs full Google Lighthouse audits to provide real-time scores and detailed reports for performance, accessibility, best practices, and SEO, including fix instructions for identified issues.
UIMax MCP
Turns Claude Code into a frontend expert that reviews and fixes your UI automatically.
One command — "review my UI at localhost:3000" — and it:
Sees your app — captures a real screenshot via Puppeteer
Audits accessibility — runs axe-core for WCAG 2.1 violations
Runs Lighthouse — real Google Lighthouse scores (Performance, Accessibility, Best Practices, SEO)
Measures performance — captures Core Web Vitals (FCP, LCP, CLS, TBT)
Audits SEO — 18 checks: meta tags, Open Graph, Twitter cards, structured data, heading hierarchy, canonical URLs
Scans your code — AST-based analysis for 25+ anti-patterns across accessibility, design, and code quality
Grades everything — per-section Report Card with letter grades (A+ through F) for Accessibility, Performance, Best Practices, SEO, and Code Quality
Generates an expert review — Claude acts as a senior frontend engineer with a baked-in review methodology
Implements the fixes — edits your actual code files, starting from critical issues down
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-mcpQuick Start
Install as MCP Server (for Claude Code)
# Add to Claude Code — that's it, no API keys needed
claude mcp add uimax -- npx -y uimax-mcpThat's it. Now in any Claude Code conversation:
You: Review the UI at http://localhost:3000, source code is in ./src
Claude Code calls review_ui ->
1. Captures screenshot of your running app
2. Runs axe-core accessibility audit
3. Runs Google Lighthouse (Performance, A11y, Best Practices, SEO)
4. Measures Core Web Vitals
5. Runs dedicated SEO audit (18 checks)
6. Scans source code with AST-based analysis
7. Generates per-section Report Card (A+ through F letter grades)
8. Returns screenshot + all data + expert review methodology
9. Claude Code generates expert review (using YOUR Pro plan -- $0 extra)
10. Claude Code implements every fix automatically
11. Review saved to .uimax-reviews.json for trackingInstall Globally
npm install -g uimax-mcpRelated MCP server: WebSee MCP Server
Tools (37)
Review Pipeline
Tool | Description |
| The main tool. Full automated pipeline: screenshot + Lighthouse + axe-core + performance + SEO + code analysis + Report Card (A+-F letter grades) + expert review methodology. Auto-saves to review history. |
| New in v0.9.0. Re-run the full audit after applying fixes. Compares against the previous review and shows a before/after Report Card with grade transitions, resolved issue count, and verdict (improved/regressed/mixed). Closes the review-fix-verify loop. |
| New in v0.9.0. Competitive benchmarking — audit two URLs side-by-side. Returns screenshots of both sites plus a comparison Report Card with grades for Accessibility, Performance, SEO, and weighted Overall score. |
| Fast design-only review. Screenshot + focused design methodology. No code analysis or performance audit. |
| Generate a standalone HTML report with everything embedded. Now includes Report Card grade cards and SEO section. Dark themed, zero dependencies. Share with your team. |
Screenshots & Visual
Tool | Description |
| Capture a high-resolution PNG screenshot of any URL. |
| Screenshots at mobile (375px), tablet (768px), and desktop (1440px) viewports. |
| Compare light mode vs dark mode (emulated). Returns both screenshots + difference percentage. |
| Pixel-level diff using |
| AI-powered visual comparison. Captures before/after + pixel diff, returns structured methodology for Claude to evaluate whether changes match the intended design request. |
Lighthouse, Performance & SEO
Tool | Description |
| Full Google Lighthouse audit — Performance, Accessibility, Best Practices, SEO scores + failing audits. |
| New in v0.8.0. Dedicated SEO audit checking 18 signals: meta title/description, heading hierarchy, Open Graph, Twitter cards, structured data (JSON-LD), canonical URLs, image alt text, viewport meta, lang attribute, and more. Weighted scoring by impact. |
| PWA readiness: installable, service worker, HTTPS, manifest, offline capability. |
| Security analysis: HTTPS, CSP, mixed content, vulnerable JS libraries, external links without |
| Find unused JavaScript and CSS with exact byte savings per resource. |
| Deep LCP analysis: what the element is, resource load time, render delay, TTFB, optimization suggestions. |
| Full resource breakdown by type, transfer sizes, request count, top 10 largest, render-blocking resources. |
| Core Web Vitals via Performance API: FCP, LCP, CLS, TBT, DOM node count, JS heap size. |
| axe-core WCAG 2.1 Level A & AA audit. Violations grouped by severity with fix instructions. |
Code Analysis
Tool | Description |
| AST-based analysis (TypeScript compiler API) for 25+ rules. Zero false positives on string literals. Falls back to regex for non-JS files. Configurable via |
Browser Interaction
Tool | Description |
| Navigate to a URL, wait for network idle. Returns page info + screenshot. |
| Click an element by CSS selector. Returns screenshot after click. |
| Type into input fields. Options: |
| Select a dropdown option by value. Returns screenshot after. |
| Scroll by pixel amount or to a specific element. Returns screenshot after. |
| Wait for an element to appear in the DOM. Returns tag name and text content. |
| Get element details: attributes, bounding box, computed styles, visibility. |
Debugging
Tool | Description |
| Capture all console messages (log, warn, error, info, debug) + uncaught exceptions during page load. |
| Capture all network requests with status, size, timing, resource type. Summary grouped by type. |
| Capture JS exceptions, unhandled rejections, and failed resource loads. |
Multi-Page
Tool | Description |
| Discover internal links from a URL and audit up to 10 pages — screenshot + axe-core + performance each. |
Baselines & Budgets
Tool | Description |
| Save current audit state to |
| Compare current state vs previous baseline. Shows improvements and regressions with letter grade transitions (e.g., "D -> B+ (+22)"). |
| Enforce performance budgets from |
Review History
Tool | Description |
| View past UIMax reviews for this project. Filter by URL, limit count. Now includes letter grades alongside scores. |
| Aggregate statistics: total reviews, score trends, most common issues, most problematic files. Includes Code Quality grades. |
| Compare two specific reviews — new issues, resolved issues, score changes with letter grade transitions. |
Every review is auto-saved. When you run
review_ui, the results are automatically persisted to.uimax-reviews.json. No manual save needed — just ask "show me my review history" anytime.
Report Card (A+ through F)
Every review_ui run now generates a per-section Report Card with letter grades on a 13-tier scale:
┌─────────────────────────────────────────────────────┐
│ REPORT CARD │
├──────────────────┬──────────┬───────┬───────────────┤
│ Section │ Score │ Grade │ Rating │
├──────────────────┼──────────┼───────┼───────────────┤
│ Accessibility │ 95 │ A │ Excellent │
│ Performance │ 72 │ C- │ Below Average │
│ Best Practices │ 88 │ B+ │ Very Good │
│ SEO │ 61 │ D- │ Very Weak │
│ Code Quality │ 83 │ B │ Good │
└──────────────────┴──────────┴───────┴───────────────┘Grades appear in:
review_uioutput — Report Card table at the top of every reviewexport_reportHTML — color-coded grade cards (green A -> red F)compare_to_baseline— grade transitions showing improvement (e.g.,D -> B+ (+22))get_review_history/get_review_stats/review_diff— grades alongside numeric scores for quick scanning
The grading scale: A+ (97+) > A (93+) > A- (90+) > B+ (87+) > B (83+) > B- (80+) > C+ (77+) > C (73+) > C- (70+) > D+ (67+) > D (63+) > D- (60+) > F (<60)
AST-Powered Code Analysis
The analyze_code tool uses the TypeScript compiler API for .ts/.tsx/.js/.jsx files — catching bugs that regex misses with zero false positives.
Rule | What AST catches that regex misses |
| Hooks inside nested if/for/while/ternary — proper scope traversal |
|
|
| Empty catch blocks — not fooled by comments |
|
|
|
|
|
|
| JSX |
Falls back to regex for file types that can't be AST-parsed and for rules without AST implementations (hardcoded colors, z-index, font sizes, etc.).
Configuration
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 analysisbudgets— Performance thresholds enforced by thecheck_budgetstool
UIMax searches for .uimaxrc.json in the target directory and up to 3 parent directories, so it works in monorepos.
Prompts
Expert review prompts that guide Claude's analysis:
Prompt | Use Case |
| Comprehensive review (design + UX + a11y + perf + code) |
| Responsive design review across viewports |
| Fast visual/UX feedback from a screenshot only |
| AI-powered before/after visual comparison |
Example Workflows
Full Review (the main workflow)
You: Review the UI at http://localhost:3000
Source code is in ./src
Claude: [Calls review_ui]
[Captures screenshot, runs Lighthouse + axe + perf + code scan]
[Generates 20+ findings with specific fixes]
[Implements every fix automatically]
[Auto-saves review to .uimax-reviews.json]Review Any Public Website
You: Review the UI at https://stripe.com
Claude: [Calls review_ui]
[Full audit of the live production site]
[Returns findings + recommendations]Track Progress Over Time
You: Show me my review history
Claude: [Calls get_review_history]
[Shows table of past reviews: dates, scores, issue counts]
You: Compare my last two reviews
Claude: [Calls review_diff]
[Shows what improved ✅, what regressed ❌, new issues, resolved issues]
You: What are my most common issues?
Claude: [Calls get_review_stats]
[Shows trends, most common issues, most problematic files]Interact with Your App
You: Navigate to localhost:3000, click the login button,
type "test@email.com" in the email field
Claude: [Calls navigate → click → type_text]
[Returns a screenshot after each action]
[Verifies each step visually]Deep Performance Analysis
You: Find unused code on https://myapp.com
Claude: [Calls unused_code]
[Lists every unused JS/CSS file with byte savings]
[Suggests what to tree-shake]
You: Why is my LCP slow?
Claude: [Calls lcp_optimization]
[Identifies the LCP element, breakdown of load time]
[Specific optimization suggestions]Verify Fixes (Close the Loop)
You: Review and fix my UI at localhost:3000
Claude: [Calls review_ui → finds 14 issues → implements fixes]
You: Now verify the fixes worked
Claude: [Calls verify_fixes]
[Re-runs full audit → compares to previous review]
Fix Verification — Before vs After
| Metric | Before | After | Change |
| Accessibility violations | 5 | 0 | ✅ -5 |
| Code findings | 9 | 2 | ✅ -7 |
| Total issues | 14 | 2 | ✅ -12 |
Verdict: ✅ IMPROVEDCompetitive Benchmarking
You: Compare my site vs stripe.com
Claude: [Calls compare_sites]
[Audits both URLs concurrently]
[Returns screenshots of both sites + comparison table]
| Category | myapp.com | stripe.com | Winner |
| Accessibility | C+ (78) | A (94) | ✅ stripe.com |
| Performance | B- (81) | A+ (98) | ✅ stripe.com |
| SEO | D (63) | A (93) | ✅ stripe.com |
| Overall | C (74) | A (95) | ✅ stripe.com |SEO Audit
You: Run an SEO audit on https://myapp.com
Claude: [Calls seo_audit]
[Checks 18 SEO signals: meta tags, Open Graph, structured data, etc.]
[Returns score, passing checks, and failed checks with fix recommendations]
[Weighted by impact: critical > high > medium > low]Debug Page Load Issues
You: What console errors does localhost:3000 produce?
Claude: [Calls capture_console]
[Returns all console messages + uncaught exceptions]
You: Show me all network requests on page load
Claude: [Calls capture_network]
[Returns every request: URL, status, size, timing]
[Summary grouped by resource type]Before/After Comparison
You: Compare localhost:3000 with localhost:3001
Claude: [Calls compare_screenshots]
[Pixel-level diff with red-highlighted changes]
[Reports exact pixel difference %]Semantic Visual Review
You: I changed the header to be sticky. Compare before and after.
Claude: [Calls semantic_compare with change description]
[Captures both states + pixel diff]
[Evaluates whether changes match the intent]
[Checks for visual regressions]Enforce Performance Budgets
You: Check if my site meets our performance budgets
Claude: [Calls check_budgets]
[Reads thresholds from .uimaxrc.json]
[Returns ✅ pass or ❌ fail for each metric]Generate Shareable Report
You: Export a full report of localhost:3000 to ./report.html
Claude: [Calls export_report]
[Generates standalone dark-themed HTML report]
[Open in any browser, share with team]Multi-Page Audit
You: Crawl localhost:3000 and audit all pages
Claude: [Calls crawl_and_review]
[Discovers internal links, audits up to 10 pages]
[Per-page: screenshot + accessibility + performance]What Claude Reviews
When using the full review_ui pipeline, Claude evaluates:
Category | What's Checked |
Visual Design | Layout, typography, color contrast, whitespace, shadows, icon consistency |
User Experience | Navigation, interaction states, loading/error/empty states, edge cases |
Accessibility | WCAG 2.1 AA, keyboard nav, screen reader compat, focus management |
Performance | Lighthouse scores, Core Web Vitals, render-blocking resources, bundle size |
SEO | Meta tags, Open Graph, Twitter cards, structured data, heading hierarchy, canonical URLs, image alt text |
Code Quality | Component architecture, CSS organization, error boundaries, TypeScript safety |
Security | HTTPS, CSP, vulnerable libraries, mixed content |
Report Card | Per-section letter grades (A+ through F) for Accessibility, Performance, Best Practices, SEO, Code Quality |
Creative | Modern UI patterns (Linear, Vercel, Raycast), micro-interactions, animations |
Code Analysis Rules
The analyze_code tool checks for 25+ rules across categories:
Rule | Severity | Category |
| High | Accessibility |
| High | Accessibility |
| High | Accessibility |
| High | Accessibility |
| Medium | Accessibility |
| Medium | Accessibility |
| High | Code Quality |
| High | Code Quality |
| High | Bug |
| Low | Code Quality |
| Low | Code Quality |
| Medium | Code Quality |
| Medium | Code Quality |
| Low | Code Quality |
| Medium | Code Quality |
| Low | Code Quality |
| Medium | Design |
| Low | Design |
| Medium | Design |
| Medium | Design |
| Medium | Performance |
| Medium | Performance |
| Medium | UX |
| Medium | UX |
| Medium/High | Code Quality |
| Medium/High | Code Quality |
All rules can be toggled via .uimaxrc.json.
Supported Frameworks
Auto-detected from package.json:
React / Next.js
Vue / Nuxt
Svelte / SvelteKit
Angular
Plain HTML/CSS/JS
Requirements
Node.js >= 18.0.0
Chrome/Chromium (uses your system Chrome — no extra download)
Claude Code (for MCP integration)
No API keys needed — runs entirely within Claude Code using your existing Pro plan
How It Works
+----------------------------------------------------------------------+
| Claude Code (your Pro plan) |
| |
| User: "Review my UI at localhost:3000 and fix everything" |
| | |
| v |
| +----------------------------------------------------------------+ |
| | UIMax MCP (37 tools) | |
| | | |
| | Screenshot -------> Puppeteer ----------> PNG Image | |
| | Accessibility ----> axe-core ------------> WCAG Violations | |
| | Lighthouse -------> Google LH ----------> Scores + Audits | |
| | Deep LH ----------> PWA/Security/LCP --> Granular Analysis | |
| | SEO Audit --------> 18 checks ----------> SEO Score | |
| | Performance ------> Perf API ----------> Web Vitals | |
| | Code Scan --------> TypeScript AST -----> Anti-patterns | |
| | Report Card ------> Grading Engine -----> A+ to F Grades | |
| | Browser ----------> Click/Type/Scroll --> Interaction | |
| | Debugging --------> Console/Network ----> Runtime Data | |
| | History ----------> .uimax-reviews.json > Progress Tracking | |
| | Expert Prompt ----> Baked-in methodology | |
| +----------------------------+-----------------------------------+ |
| | |
| v |
| Claude Code receives: screenshot + data + expert methodology |
| | |
| v |
| Claude acts as world-class frontend expert (FREE -- Pro plan) |
| Generates comprehensive review with exact fixes |
| | |
| v |
| Claude implements every fix in the codebase automatically |
| |
+----------------------------------------------------------------------+CI / GitHub Action
UIMax ships with a reusable GitHub Action that runs audits on every PR and posts a Report Card comment.
Quick Setup
Copy the example workflow to your project:
# .github/workflows/uimax-ci.yml
name: UIMax Review
on:
pull_request:
branches: [main]
jobs:
uimax-review:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: "20"
# Build and start your app
- run: npm ci && npm run build
- run: npm start &
- run: npx wait-on http://localhost:3000
# Run UIMax
- uses: prembobby39-gif/uimax-mcp/.github/actions/uimax-review@main
with:
url: http://localhost:3000
budget-accessibility: 90
budget-performance: 80
budget-seo: 80
max-violations: 0Action Inputs
Input | Description | Required | Default |
| URL to audit | Yes | — |
| Token for PR comments | No |
|
| Min performance score (0-100) | No | — |
| Min accessibility score (0-100) | No | — |
| Min SEO score (0-100) | No | — |
| Max allowed a11y violations | No | — |
| Fail if grades regress | No |
|
Action Outputs
Output | Description |
| Letter grade (A+ through F) |
| Letter grade |
| Letter grade |
| Accessibility violation count |
| Whether all budgets passed ( |
| Full markdown report |
The action updates existing UIMax comments on re-push (no duplicate comments).
See examples/uimax-ci.yml for a complete working example.
Development
# Clone
git clone https://github.com/prembobby39-gif/uimax-mcp.git
cd uimax-mcp
# Install
npm install
# Build
npm run build
# Run tests
npm test
# Run tests with coverage
npm run test:coverage
# Test locally with Claude Code
claude mcp add uimax-dev -- node /path/to/uimax-mcp/dist/index.jsContributing
Contributions welcome! Some ideas:
CSS specificity analyzer
Design token extraction
Framework-specific checks (Vue composition API, Svelte stores)
Visual regression with pixel-level diffing
Performance budgets (fail if scores drop below thresholds)
Browser interaction (click, type, scroll, navigate)
Console and network capture
Deep Lighthouse analysis (PWA, security, unused code, LCP, resources)
AI-powered semantic visual comparison
Review history tracking with auto-save
Dedicated SEO audit (18 checks, weighted scoring)
Per-section letter grades (A+ through F Report Card)
Verify fixes (before/after comparison with grade transitions)
Competitive benchmarking (side-by-side site comparison)
CI/CD integration (GitHub Action for automated review on PR)
Custom rule plugins (user-defined regex rules)
Figma design comparison (screenshot vs Figma mock)
Cross-browser testing (Firefox, WebKit via Playwright)
License
MIT
Available Tools
37 toolsaccessibility_auditA
Run an automated accessibility audit using axe-core. Checks for WCAG 2.1 Level A and AA violations, reporting issues by severity with specific fix instructions.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to audit |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided; description carries burden. It states the tool checks for violations and reports issues with fix instructions, but does not mention side effects (none expected) or specific behaviors like URL accessibility requirements.
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?
Two sentences, front-loaded with action and scope, no redundant 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?
Covers purpose, standards, and output report style. Lacks explicit mention of return format or limitations, but sufficient for a straightforward audit tool with one parameter.
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?
Single parameter (url) with 100% schema coverage. Description adds context about axe-core and WCAG but not about the parameter itself. Baseline 3 is appropriate.
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?
Description clearly states the tool runs an automated accessibility audit with axe-core, specifies WCAG 2.1 Level A and AA, and distinguishes from siblings like seo_audit or performance_audit.
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 explicit guidance on when to use this tool over alternatives like lighthouse_audit or compare_sites. Does not mention prerequisites or exclusions.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
analyze_codeB
Analyze frontend source code for quality issues: accessibility anti-patterns, CSS problems, component complexity, design inconsistencies, and performance concerns.
| Name | Required | Description | Default |
|---|---|---|---|
| directory | Yes | Absolute path to the frontend source directory (e.g., /Users/me/project/src) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description bears full responsibility for behavioral disclosure. It states the tool 'analyzes' but does not clarify whether it is read-only, what output is produced, or if any side effects occur (e.g., report generation). This is a significant gap given the absence of annotations.
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 sentence that is concise and front-loaded with the main action. It lists the issue categories efficiently without wasted words, though it could benefit from slightly more structure (e.g., bullet points).
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 an output schema and annotations, the description is incomplete. It does not mention what happens after analysis (e.g., returns a report, saves results) or how the agent can access the results. Sibling tools like 'export_report' suggest downstream steps, but this connection is not made.
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 coverage is 100% with a single parameter that already has a description ('Absolute path to the frontend source directory'). The tool description adds no further parameter-specific meaning, meeting the baseline for high 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 analyzes frontend source code for a specific set of quality issues (accessibility, CSS, complexity, design, performance). It distinguishes itself from more specialized sibling tools like accessibility_audit or performance_audit by offering a broad, combined analysis.
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 a general analysis use case but provides no explicit guidance on when to choose this tool over the many specialized sibling tools. It lacks when-to-use/when-not-to-use context, leaving the agent to infer the appropriate scenario.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
capture_consoleA
Capture all console messages (log, warn, error, info, debug) during page load. Navigates to the URL, listens for console output and uncaught exceptions, then returns structured results with message counts by level. Useful for debugging runtime issues, detecting warnings, and finding errors that only appear in the browser console.
Note: Console messages may contain sensitive data (tokens, user info, etc.) — the output is returned unfiltered.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to capture console logs from (e.g., http://localhost:3000) | |
| waitMs | No | Time in ms to wait after page load for additional console messages (default 3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description takes on the full burden. It discloses that the tool navigates to the URL, listens for console output and uncaught exceptions, returns structured results with counts, and warns that output may contain sensitive data unfiltered. It also notes it is free and runs within Claude Code, adding useful 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 three paragraphs: first explains purpose and behavior, second warns about sensitive data, third notes it is free. It is front-loaded with the key action and value. Some sentences could be consolidated without losing meaning, but overall it is efficient.
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?
Despite lacking annotations and an output schema, the description covers the tool's behavior, input parameters, data sensitivity, and pricing. It does not detail the exact output structure beyond 'message counts by level', but the context is sufficient for an agent to understand usage and risks.
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?
Input schema has 100% coverage with descriptions for both parameters (url and waitMs). The tool description explains the overall process but does not add significant detail beyond the schema. The note about sensitive data is relevant but not parameter-specific. Baseline 3 is appropriate.
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 captures all console messages during page load, specifying message types (log, warn, error, info, debug). It effectively differentiates from siblings like 'capture_errors' by emphasizing the full console output, though it does not explicitly contrast with sibling tools.
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 says the tool is 'useful for debugging runtime issues, detecting warnings, and finding errors that only appear in the browser console,' implying usage context. However, it does not provide explicit when-not-to-use guidance or mention alternative tools for similar tasks.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
capture_errorsA
Capture JavaScript errors, uncaught exceptions, unhandled promise rejections, and failed resource loads (images, scripts, stylesheets, fonts) during page load. Returns structured error list with error kind, message, and source location. Useful for finding runtime JS errors and broken resources that affect user experience.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to capture errors from (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided. Describes itself as free but lacks disclosure of side effects, authorization needs, or whether it modifies page state. The tool likely only reads errors, but this is not stated explicitly.
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?
Two sentences plus a free note, front-loaded with purpose. No redundant 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?
Adequately explains what the tool does and returns for a single-parameter tool without output schema. Missing details like timeout or error handling for inaccessible URLs, but overall complete enough.
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 coverage is 100% with a clear description for the url parameter. The description adds context about capturing errors during page load and the return format, but does not provide substantial additional meaning beyond the schema.
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?
Clearly states it captures JavaScript errors, uncaught exceptions, unhandled promise rejections, and failed resource loads. Distinguishes from sibling tools like capture_console and capture_network by focusing on errors specifically.
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?
Implies usage for finding runtime JS errors and broken resources, but does not explicitly state when to use versus alternatives or provide when-not guidance.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
capture_networkA
Capture all network requests during page load with status codes, sizes, timing, and resource types. Provides a summary with total requests, failed requests, total transfer size, and breakdown by resource type. Useful for finding failed API calls, slow requests, large assets, and understanding page load behavior.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to capture network requests from (e.g., http://localhost:3000) | |
| waitMs | No | Time in ms to wait after page load for additional network activity (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. It explains it captures during page load and returns a summary, but doesn't state side effects (e.g., page navigation, state changes) or permissions needed. For a capture tool, it's likely read-only, but not explicitly said.
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 two sentences, front-loaded with the core purpose. The first sentence is somewhat long but packs information efficiently. A minor improvement would be to split it for 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 no output schema, the description mentions the summary output (total requests, failed, size, breakdown). It covers common use cases and explains the tool's nature (free, within Claude Code). It doesn't detail pagination or filtering but is fairly complete for a network request capture tool.
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 coverage is 100% as both parameters (url, waitMs) have descriptions in the schema. The description adds no extra meaning beyond what the schema provides, so baseline 3 is appropriate.
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 captures network requests during page load, listing specific details (status codes, sizes, timing, resource types) and provides a summary. It distinguishes from sibling tools like capture_console or capture_errors by focusing on network-level data.
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 says it's useful for finding failed API calls, slow requests, etc., giving good usage context. It notes the tool is free and runs within Claude Code, but doesn't explicitly exclude alternatives or mention when not to use it. Sibling tools like performance_audit exist but no direct comparison is made.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
check_budgetsA
Check if the current site meets performance budgets defined in .uimaxrc.json. Runs fresh audits and compares results against budget thresholds for Lighthouse scores, Web Vitals, accessibility violations, and code issues. Returns pass/fail with details of any exceeded budgets.
Configure budgets in .uimaxrc.json under the "budgets" key: { "budgets": { "lighthouse": { "performance": 90, "accessibility": 95 }, "webVitals": { "lcp": 2500, "cls": 0.1 }, "maxAccessibilityViolations": 0 } }
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the running application (e.g., http://localhost:3000) | |
| codeDir | No | Project directory containing .uimaxrc.json with budget config (defaults to cwd) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided, so description carries full burden. It mentions running fresh audits and being free/in-Claude, but lacks detail on side effects, caching, or destructive actions.
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?
Description is well-structured: first sentence states purpose, then details, example JSON, and a free note. Each part is necessary and front-loaded.
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?
Gives clear output format and configuration details. Lacks mention of output schema but compensated by describing return value. Complete enough for a straightforward budget check.
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 covers both params with descriptions (100% coverage). Description adds value by explaining the budget config structure and the role of codeDir.
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?
Description clearly states the tool checks budgets against .uimaxrc.json config, runs audits, and returns pass/fail. Distinct from sibling audit tools that produce raw scores.
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?
Description implies usage when budget config exists and pass/fail check is needed, contrasting with standalone audits. However, no explicit alternatives or when-not-to-use.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
check_dark_modeA
Detect whether a webpage supports dark mode. Captures two screenshots — one in light mode and one with prefers-color-scheme: dark emulated — then compares them. Returns both screenshots and a difference percentage. Great for checking if dark mode is properly implemented.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to check |
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. It discloses the two-screenshot process and comparison, returning both images and difference percentage. However, it could clarify the interpretation of the percentage (e.g., threshold for 'support').
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 two sentences, front-loading the purpose and concisely explaining the process and output. No wasted words.
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 output schema, the description covers return values (screenshots, difference percentage). It lacks details on potential errors or limitations but is adequate for a simple tool.
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 coverage is 100% with a description for the url parameter. The tool description does not add further semantic details about the url beyond what the schema provides, so it meets the baseline.
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 detects dark mode support via screenshots and comparison, with a specific verb ('Detect') and resource ('dark mode'). It distinguishes from sibling tools like compare_screenshots and screenshot by focusing on light/dark comparison.
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 use for checking dark mode implementation and provides context, but does not explicitly state when not to use it or mention alternatives among siblings.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
clickA
Click an element by CSS selector. Returns a screenshot after the click so you can visually verify the result. Supports standard CSS selectors. If the page hasn't been navigated yet, provide a URL to navigate first.
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the element to click (e.g., 'button.submit', '#login-btn') | |
| url | No | Optional URL to navigate to before clicking | |
| waitAfter | No | Optional milliseconds to wait after clicking (for animations/transitions) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so description carries full burden. It discloses returning screenshot for visual verification and the need for URL if not navigated. Does not mention potential side effects like navigation or error handling if element not found.
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?
Three concise sentences with front-loaded purpose. Every sentence adds value. No 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?
Covers main behavior, return value (screenshot), and optional navigation. No output schema, but description adequately explains what to expect. Lacks error handling details but sufficient for a simple tool.
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 has 100% coverage so baseline is 3. The description adds context for 'url' and 'waitAfter' (e.g., 'for animations/transitions'), adding slight value beyond schema.
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?
Clearly states 'Click an element by CSS selector' with specific verb and resource. Distinguishes from siblings like select_option and type_text. Mentions return of screenshot for verification.
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?
Provides guidance: if page not navigated, provide URL first. Implicitly tells when to use (need to click) and why URL param exists. Lacks explicit alternatives or when-not-to-use cases.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
compare_screenshotsA
Before/after visual comparison with pixel-level diffing. Captures screenshots of two URLs at the same viewport size, computes an accurate pixel-level difference using pixelmatch, and returns BOTH images plus a red-highlighted diff image showing exactly which pixels changed. Use this to verify UI changes, compare staging vs production, or check before/after states of a redesign.
| Name | Required | Description | Default |
|---|---|---|---|
| urlA | Yes | First URL — the 'before' state (e.g., http://localhost:3000) | |
| urlB | Yes | Second URL — the 'after' state (e.g., http://localhost:3001) | |
| width | No | Viewport width in pixels | |
| height | No | Viewport height in pixels |
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. It transparently states the tool captures screenshots, computes pixel-level diff, and returns both original images plus a diff image. No side effects or constraints are mentioned, but the behavior is well-described.
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 three sentences, front-loading the core action ('Before/after visual comparison with pixel-level diffing') followed by the process and use cases. No redundant or unnecessary text.
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?
With 4 parameters (2 required) and no output schema, the description adequately covers what the tool does and what it returns (images + diff). It lacks details on output format, but for a visual comparison tool, the explanation is sufficient.
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 coverage is 100% with descriptions for all parameters. The description adds context by labeling urlA and urlB as 'before' and 'after' and providing example values, and explaining width/height as viewport size, adding value beyond the schema.
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 does before/after visual comparison with pixel-level diffing, capturing screenshots of two URLs and returning images plus a diff. It distinguishes from siblings like 'compare_to_baseline' or 'compare_sites' by specifying the exact process.
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 explicitly provides use cases: 'verify UI changes, compare staging vs production, or check before/after states of a redesign.' It lacks explicit when-not-to-use or alternatives, but the context is clear enough for agent selection.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
compare_sitesA
Competitive benchmarking: audit two URLs side-by-side and produce a comparison Report Card. Runs accessibility (axe-core), performance (Core Web Vitals), and SEO audits on both sites concurrently. Returns screenshots of both sites plus a grade comparison table showing which site wins in each category.
Use this when the user wants to benchmark their site against a competitor, compare staging vs production, or evaluate two different sites.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| urlA | Yes | First URL to audit (e.g., http://localhost:3000 or https://mysite.com) | |
| urlB | Yes | Second URL to audit (e.g., https://competitor.com) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description discloses key behaviors: concurrent audits, return of screenshots and grade comparison table, and that it is free. However, it does not state if the tool is read-only, mention potential performance impacts, or describe error conditions. More context on side effects would improve transparency.
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 two short paragraphs with no redundant information. The first paragraph immediately states the tool's purpose and actions, and the second provides usage guidance and a note about cost. Every sentence adds value.
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 output schema, the description adequately explains the output (screenshots and grade comparison table). It covers the main inputs, actions, and outputs. It could benefit from more detail on the output format or error handling, but it is sufficiently complete for an agent to understand the tool's role.
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 coverage is 100% with clear descriptions for each parameter. The description adds minimal extra meaning beyond the schema; it reiterates the URLs and their purpose (first and second URL to audit). Baseline of 3 is appropriate given sufficient 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 performs competitive benchmarking by auditing two URLs side-by-side and producing a comparison report card. It explicitly lists the audit types (accessibility, performance, SEO) and differentiates from sibling tools like 'compare_screenshots' and individual audit tools.
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 explicit use cases: 'benchmark their site against a competitor, compare staging vs production, or evaluate two different sites.' It implies when to use this comprehensive tool over single-audit tools, but does not include explicit negative guidance or alternatives.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
compare_to_baselineA
Compare the current audit state of a URL against its most recent saved baseline. Runs fresh audits, loads the previous baseline from .uimax-history.json, and shows what improved and what regressed. Use this after making changes to verify you improved the metrics you intended.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the running application (e.g., http://localhost:3000) | |
| codeDir | No | Project directory containing .uimax-history.json (defaults to cwd) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description carries the burden. It discloses key behaviors: runs fresh audits, loads previous baseline from file, shows deltas. Also notes it's free and runs locally. No contradictions.
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?
Four sentences in two paragraphs, front-loaded with the main purpose, followed by process details and usage guidance. No redundant or extraneous text; every sentence earns its place.
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?
For a simple two-parameter tool with no output schema, the description fully explains what it does, how it works, and when to use it. It covers inputs and the process sufficiently for an agent to invoke correctly.
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 baseline is 3. The description adds context by mentioning 'URL' and 'previous baseline from .uimax-history.json', reinforcing the codeDir parameter's purpose, but doesn't add substantial new information beyond the schema.
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?
Description clearly states the verb 'compare', the resource 'audit state against baseline', and the outcome 'shows what improved and regressed'. It distinguishes itself from siblings like 'save_baseline' by focusing on comparison.
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?
Provides explicit when-to-use context: 'Use this after making changes to verify you improved the metrics you intended.' No explicit when-not or alternatives, but the guidance is clear and actionable.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
crawl_and_reviewA
Crawl multiple pages from a starting URL and run accessibility + performance audits on each. Discovers internal links from the start page, deduplicates them, and visits up to maxPages (default 5, max 10). Each page gets a screenshot, axe-core accessibility audit, and Performance API metrics. Does NOT run Lighthouse (too slow for multi-page). Use this to audit an entire site section quickly.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | Starting URL to crawl from (e.g., http://localhost:3000) | |
| maxPages | No | Maximum number of pages to audit (1-10, default 5) | |
| codeDir | No | Optional code directory path (reserved for future use) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations exist, so the description fully discloses behavior: discovers internal links, deduplicates, visits up to maxPages (with default and max), and performs screenshot, axe-core audit, and Performance API metrics on each page. It also notes the tool is free and runs within Claude Code. This is comprehensive for a read-only audit tool.
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 concise (5 sentences) with each sentence adding unique value. It is front-loaded with the core functionality and ends with a note on cost. No filler or repetition.
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?
While there is no output schema, the description lists what each page audit produces (screenshot, axe-core, Performance API) and the page limit. It could be more complete by describing the return format or structure, but it provides sufficient context for an agent to invoke correctly.
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 coverage is 100%, so the baseline is 3. The description adds value by specifying the max for maxPages (10) beyond the schema's default, and clarifies the purpose of codeDir as 'reserved for future use'. This extra context justifies a 4.
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 crawls multiple pages from a starting URL and runs accessibility + performance audits. It distinguishes itself from the sibling lighthouse_audit by explicitly stating it does NOT run Lighthouse.
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 advises using this tool to 'audit an entire site section quickly' and clarifies it does not run Lighthouse, providing clear differentiation from sibling tools. However, it does not explicitly state when not to use it or list alternative tools.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
export_reportA
Generate a standalone HTML report file with all audit findings embedded. Runs the full review pipeline (screenshot, accessibility, performance, code analysis) and outputs a beautiful, shareable HTML file with zero external dependencies.
Use this when the user wants a downloadable/shareable report of their UI review.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the running application (e.g., http://localhost:3000) | |
| codeDirectory | Yes | Absolute path to the frontend source directory (e.g., /Users/me/project/src) | |
| outputPath | No | Output file path for the HTML report (defaults to ./uimax-report.html) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided, so description carries full burden. It discloses that the tool runs a full review pipeline and is 'FREE' within Claude Code, but does not detail side effects (e.g., runtime, file overwrite, state changes). Adequate but has 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?
Three sentences, each serving a clear purpose: main action, usage guideline, and a free note. No fluff, front-loaded with key 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 three parameters (all described), no output schema, and no annotations, the description covers the tool's purpose, output, and when to use. Missing details on prerequisites (e.g., app must be running) and error handling, but sufficient for a file-generation tool.
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 coverage is 100% with descriptions for all three parameters. The description adds minimal extra meaning (e.g., outputPath default). With high schema coverage, baseline 3 is appropriate.
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?
Clearly states the tool generates a standalone HTML report with all audit findings embedded. It specifies the full pipeline (screenshot, accessibility, performance, code analysis) and distinguishes from siblings by focusing on a shareable file output.
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?
Explicitly states when to use: 'when the user wants a downloadable/shareable report of their UI review.' Does not specify when not to use or mention alternatives, but the context of siblings implies alternatives for individual audits.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
get_elementA
Get detailed information about a DOM element: tag name, text content, all attributes, bounding box, and computed styles (color, font, background, display, visibility). Returns a screenshot so you can visually identify the element in context.
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the element to inspect | |
| url | No | Optional URL to navigate to before inspecting |
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. It discloses the returned data (attributes, styles, screenshot) fairly well. However, it does not explicitly state that the tool is read-only or idempotent, which would be helpful with no annotations.
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?
Two concise sentences, front-loaded with purpose and key details. Every sentence adds value, no redundancy.
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 output schema, the description adequately enumerates return fields (tag name, text, attributes, bounding box, styles, screenshot). For a read-oriented tool with moderate complexity, this is sufficient.
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 already describes both parameters (selector and URL) with descriptions. The description adds minimal value beyond schema, clarifying selector as CSS and URL as optional navigation. With 100% schema coverage, baseline 3 is appropriate.
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 retrieves detailed information (tag name, text, attributes, bounding box, computed styles) and returns a screenshot. It uses a specific verb (get) and resource (element), and distinguishes from sibling tools like screenshot.
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 the tool is used for inspecting specific DOM elements, but provides no explicit guidance on when to use it versus alternatives like accessibility_audit or analyze_code. No exclusions or when-not-to-use context.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
get_review_historyA
View past UIMax reviews for this project. Shows when reviews were run, what scores were achieved, and how many issues were found. Use this to understand the project's frontend health over time.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| codeDir | No | Project directory containing .uimax-reviews.json (defaults to cwd) | |
| limit | No | Maximum number of reviews to return (default 10) | |
| url | No | Filter reviews by URL |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries full burden. It discloses that the tool is free and runs entirely within Claude Code, implying no external API calls. The read-only nature is clear from the verb 'view'. It does not explicitly mention that it reads from a local file, but the parameter documentation covers that.
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 very concise with two short sentences for purpose and one sentence for the free note. It is front-loaded and free of fluff, earning its place.
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?
The tool is simple, and the description covers its purpose and key output fields. The schema explains parameters. Without an output schema, the description mentions what the output shows (scores, issues). It could mention ordering or pagination but is sufficient for a basic history tool.
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 coverage is 100%, so the schema already documents all parameters. The description adds no new meaning beyond the schema. Baseline 3 is appropriate.
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 'view' and resource 'past UIMax reviews'. It lists the data fields (when reviews were run, scores, issues) and frames the use case as understanding frontend health over time, distinguishing it from siblings like 'get_review_stats' which likely provides aggregate statistics.
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 explicitly says 'Use this to understand the project's frontend health over time' and notes the tool is free, which provides context for when to use it. However, it does not specify when not to use it or mention alternatives among the many sibling tools.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
get_review_statsA
Get aggregate statistics across all UIMax reviews for this project. Shows total reviews, score trends, most common issues, and most problematic files.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| codeDir | No | Project directory containing .uimax-reviews.json (defaults to cwd) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations exist, so the description carries the burden. It mentions the tool is free and runs locally, which is useful behavioral context, but does not disclose data freshness, side effects, or permissions needed.
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?
Two sentences: first explains what the tool does, second adds a key usage note (free). No wasted words, front-loaded with essential info.
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?
For a simple stats retrieval tool with no output schema, the description covers the input parameter, output contents, and a behavioral trait (free/local). Minor gaps (e.g., live vs cached data) but adequate for the tool's complexity.
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 coverage is 100%, and the description adds no extra meaning beyond the schema's own parameter description. Baseline score of 3 is appropriate as the schema already documents the parameter fully.
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 it retrieves aggregate statistics from UIMax reviews, listing specific outputs (total reviews, score trends, etc.). This differentiates it from sibling tools like 'accessibility_audit' or 'analyze_code' which have distinct purposes.
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 notes the tool is free and runs within Claude Code, implying it should be used when cost is a concern, but it does not explicitly compare with alternatives or specify when not to use it.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
lcp_optimizationA
Deep Largest Contentful Paint (LCP) analysis. Identifies the LCP element, measures TTFB, resource load time, and render delay. Provides specific optimization suggestions to improve LCP below the 2.5s threshold.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to analyze LCP (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are present, so the description must carry the full burden. It describes the outputs (element identification, measurements, suggestions) but does not disclose behavioral traits such as whether the tool modifies state, requires network access, or has resource implications. The description is adequate but could be more explicit about side effects.
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 three sentences with no redundant information. It front-loads the purpose and efficiently covers what the tool does and what it returns. Every sentence contributes value.
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 there is no output schema, the description adequately explains what the tool returns (element ID, measurements, suggestions). The single parameter is well-documented in the schema. The description is complete for the tool's function and 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 input schema covers the single parameter 'url' with a clear description. The tool's description does not add additional meaning beyond the schema; it just sets context. Since schema coverage is 100%, a baseline of 3 is appropriate.
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 it is a 'Deep Largest Contentful Paint (LCP) analysis' and enumerates specific capabilities: identifying the LCP element, measuring TTFB, resource load time, render delay, and providing optimization suggestions. This is a specific verb-resource combination that distinguishes it from sibling audit tools like 'performance_audit' or 'lighthouse_audit'.
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 for improving LCP performance and mentions a threshold (2.5s), but does not explicitly state when to use this tool versus alternatives or when not to use it. No exclusion or comparison to siblings is provided, leaving the agent to infer context.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
lighthouse_auditA
Run a full Lighthouse audit against a URL. Returns scores for Performance, Accessibility, Best Practices, and SEO (0-100), plus detailed audit findings for render-blocking resources, image optimization, unused code, and more. Heavier than performance_audit but provides industry-standard Lighthouse scores.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to audit (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description must cover behavioral traits. It implies a read-only audit ('run a full Lighthouse audit') and mentions it is 'heavier' (resource cost), but does not explicitly confirm non-destructive nature, permissions, or rate limits.
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?
Two concise sentences that front-load the action and output, then briefly compare to a sibling. No filler, every sentence adds value.
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?
For a single-parameter tool with no output schema, the description adequately covers purpose, output, and relative weight. Missing details like return format or exhaustive list of findings are minor given the simplicity.
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 coverage is 100% with a clear description for the 'url' parameter. The tool description does not add additional semantic context beyond the schema, meeting the baseline for full 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 it runs a full Lighthouse audit on a URL and returns scores and findings. It distinguishes from sibling 'performance_audit' by noting it is heavier and provides industry-standard scores.
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 contrasts with 'performance_audit' providing a when-to-use hint. However, it lacks explicit 'when not to use' or mention of other siblings like 'seo_audit', 'accessibility_audit', etc., which are all related but not compared.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
performance_auditB
Measure Core Web Vitals and performance metrics: FCP, LCP, CLS, TBT, load time, resource count, DOM size, and JS heap usage.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to measure |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided, so description carries full burden. Implies a read-only measurement operation, but does not explicitly state non-destructive behavior or side effects. Adequate for a simple measurement tool.
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?
Single sentence, front-loaded with the action and metrics, no redundancy. Maximum conciseness.
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 simple tool with one parameter and no output schema, description covers the key purpose. Could describe return format implicitly, but sufficient for selection.
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 coverage is 100% for the single 'url' parameter, which is described clearly in the schema. The description adds no additional meaning beyond what the schema provides.
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 measures Core Web Vitals and performance metrics, listing specific metrics like FCP, LCP, etc. It distinguishes from sibling tools like accessibility_audit and lighthouse_audit, though it could explicitly mention when to use this over Lighthouse audit.
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 on when to use this tool versus alternatives like lighthouse_audit or check_budgets. Missing explicit context or exclusions.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
pwa_auditA
Check Progressive Web App readiness: installable manifest, service worker, HTTPS, offline capability, and more. Runs a full Lighthouse audit under the hood and extracts all PWA-related audit results with pass/fail for each requirement.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to check for PWA readiness (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the burden. It reveals that a full Lighthouse audit runs under the hood, but does not disclose read-only behavior, potential network usage, or side effects. Some transparency is present but not exhaustive.
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?
Two concise sentences: first sentence states the purpose, second explains the mechanism. No wasted words, front-loaded with core functionality.
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?
For a simple one-parameter tool with no output schema, the description covers the main function and result format (pass/fail). Lacks mention of prerequisites (e.g., network) or limitations, but is generally 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 coverage is 100% with a clear description of the 'url' parameter. The description adds no additional meaning beyond the schema, so baseline 3 is appropriate.
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 it checks PWA readiness, listing specific aspects (manifest, service worker, HTTPS, offline). It distinguishes from siblings like performance_audit and lighthouse_audit by focusing solely on PWA criteria.
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 use for PWA verification but does not explicitly state when to use this tool over alternatives like lighthouse_audit (which also runs Lighthouse) or other specialized audits. No when-not guidance is provided.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
quick_reviewA
Quick design-only review. Captures a screenshot and returns it with a focused design review methodology. No code analysis, no performance audit — just visual/UX feedback. Great for rapid design iteration.
After receiving the screenshot, analyze it as a senior UI designer and provide 5-10 high-impact observations with specific fixes.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to review |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Discloses that the tool is free and runs entirely within Claude Code. Mentions capturing a screenshot and returning it with a design review. However, it does not detail whether the tool modifies state, requires user input after capture, or the exact nature of the return behavior. The description mixes instructions to the user with tool 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?
Description is concise with three sentences. The first sentence clearly states purpose. The subsequent sentences add context and usage guidance, though the instruction about analyzing the screenshot could be considered redundant or user guidance rather than tool description.
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 simplicity (one parameter, no output schema, no annotations), the description adequately covers purpose, exclusions, and usage context (rapid design iteration). It lacks information about error conditions or return format, but these are minimal concerns for this tool.
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 coverage is 100% for the single parameter, so the schema already provides a clear description. The description adds no additional parameter semantics beyond 'captures a screenshot' which is implicit from the tool's purpose.
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?
Clearly states it is a 'design-only review' that captures a screenshot and provides visual/UX feedback. Explicitly distinguishes from siblings by stating 'No code analysis, no performance audit — just visual/UX feedback.' The verb+resource is specific and the scope is well-defined.
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?
States it is 'Great for rapid design iteration' and excludes code/performance analysis, implying when to use. However, it does not explicitly name alternatives or provide exclusion criteria beyond the implicit contrast with non-design tools.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
resource_analysisB
Full resource breakdown of a page: total transfer size, breakdown by type (JS, CSS, images, fonts), number of requests, top 10 largest resources, and render-blocking resources. Helps identify what is making your page heavy.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to analyze resources (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description carries full burden for behavioral traits. It does not mention that the tool is read-only, has no side effects, or any prerequisites (e.g., page must be loaded). The description only describes output, not 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?
Two sentences, no unnecessary words. Front-loaded with 'Full resource breakdown', immediately conveying purpose. Every sentence adds value.
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 one parameter and no output schema, the description adequately lists what the tool returns (transfer size, type breakdown, requests, top 10, render-blocking). Could mention result format (JSON) but not required for basic completeness.
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?
Single parameter 'url' with 100% schema coverage. Description adds example format (http://localhost:3000) but schema already provides format=uri and description. Baseline 3 is appropriate as schema covers the meaning, and description adds marginal value.
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 it performs a 'full resource breakdown' listing specific metrics (transfer size, type breakdown, requests, top 10, render-blocking). It distinguishes from siblings like performance_audit by focusing on resource loading rather than overall performance scores.
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 explicit guidance on when to use this tool versus alternatives (e.g., performance_audit, lighthouse_audit). The description implies it's for identifying heavy resources, but lacks when-not or comparison to sibling tools.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
responsive_screenshotsA
Capture screenshots at mobile (375px), tablet (768px), and desktop (1440px) viewports. Perfect for reviewing responsive design.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to capture |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description bears full responsibility. It does not disclose behavioral traits such as error handling, return format (base64 or URLs), or whether screenshots are saved. The description only states the action without any side effects or limitations.
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 consists of two sentences with no unnecessary words. The primary action is front-loaded, and the second sentence adds relevant context. Every part earns its place.
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?
With no output schema, the description should explain what the tool returns (e.g., an array of screenshot data). It fails to do so. However, the task is simple (single parameter, three viewports), so the gap is moderate. Adequate for minimal use but incomplete.
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 coverage is 100% for the single parameter 'url', which includes its own description. The tool description adds the context of capturing at three viewports but does not elaborate on the parameter's format or constraints beyond what the schema provides. Baseline 3 is appropriate.
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 'Capture screenshots at mobile (375px), tablet (768px), and desktop (1440px) viewports.' It uses a specific verb ('capture') and resource ('screenshots at specific viewports'), and distinguishes itself from sibling tools like 'screenshot' (single viewport) and 'compare_screenshots'.
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 phrase 'Perfect for reviewing responsive design' indicates the primary use case. While it does not explicitly mention when not to use or name alternatives, the context is clear given the sibling tool list (e.g., 'screenshot' for single viewport).
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
review_diffA
Compare two specific reviews to see what changed. Shows new issues, resolved issues, and score changes.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| codeDir | No | Project directory containing .uimax-reviews.json (defaults to cwd) | |
| reviewIdA | Yes | ID of the older review to compare | |
| reviewIdB | Yes | ID of the newer review to compare (or 'latest' for the most recent review) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden. It discloses that the tool is free and runs locally in Claude Code, which is helpful. However, it does not state whether the tool is read-only, whether it has side effects, or what the output format is. This leaves 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 concise with two sentences plus a notable line about being free. It is front-loaded with the core purpose. The free note is useful but slightly extraneous, keeping it from a 5.
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?
The tool has 3 parameters, no output schema, and no annotations. The description covers the purpose and output highlights but does not mention output format, error conditions, or prerequisites (e.g., reviews must exist). Adequate but not thorough.
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 provides 100% coverage with clear descriptions for each parameter (codeDir, reviewIdA, reviewIdB). The description adds little beyond noting the tool shows new/resolved issues and score changes, which does not directly explain parameter usage. Baseline 3 is appropriate.
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 compares two specific reviews and shows what changed (new issues, resolved issues, score changes). This is specific and distinguishes it from sibling tools like get_review_history or semantic_compare.
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 mentions it is free and runs within Claude Code, which hints at when to use, but does not explicitly state when to use this tool versus alternatives like quick_review or compare_sites. No guidance on prerequisites or when not to use.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
review_uiB
THE PRIMARY TOOL — Fully automated UI review pipeline. Captures a screenshot, runs accessibility/performance/code audits, then returns ALL data along with an expert frontend review methodology so you can generate a comprehensive review and implement fixes.
Use this when the user asks to "review my UI", "audit my frontend", or "find UI issues". After receiving the results, you MUST:
Study the screenshot carefully for visual/UX issues
Analyze the audit data following the expert methodology provided
Generate a comprehensive review with SPECIFIC fixes (exact CSS values, code changes)
Implement the fixes directly in the codebase
This tool is FREE — it runs entirely within Claude Code using the user's existing plan. No API keys needed.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the running application (e.g., http://localhost:3000) | |
| codeDirectory | Yes | Absolute path to the frontend source directory (e.g., /Users/me/project/src) | |
| width | No | Viewport width in pixels | |
| height | No | Viewport height in pixels |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description carries full burden. It discloses that the tool captures a screenshot, runs audits, and returns data with methodology. However, it does not explicitly state whether it modifies anything (e.g., navigates to URL, changes files), nor does it describe potential side effects or permissions needed. The claim 'runs entirely within Claude Code' is helpful but incomplete.
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 front-loaded with the purpose, but it includes an all-caps emphasis and a list of mandatory steps that could be more concise. The first paragraph is efficient, but the subsequent instructions add verbosity without being excessively long.
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 large number of sibling tools (e.g., lighthouse_audit, accessibility_audit, quick_review), the description fails to explain how review_ui relates to them or when to prefer an individual audit. No output schema exists, yet the description only says 'returns ALL data' without detailing what fields or structure to expect, leaving the agent uninformed.
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 coverage is 100%, so baseline is 3. The description does not add any extra meaning beyond what the parameter names and schema descriptions already provide. Parameters are straightforward (url, codeDirectory, width, height), and the description doesn't clarify formats or constraints further.
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 it's a pipeline for UI review, capturing screenshots and running multiple audits. It specifies when to use it (when user asks to 'review my UI', etc.). However, it doesn't explicitly differentiate from sibling composite tools like quick_review or the individual audit tools, which share 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?
Explicitly says 'Use this when the user asks to...' and provides mandatory post-usage steps (study screenshot, analyze data, generate review, implement fixes). It also notes the tool is free. No when-not-to-use guidance is provided, but the context is clear.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
save_baselineA
Save the current audit state for a URL as a baseline snapshot. Runs screenshot, accessibility, performance, and Lighthouse audits, then saves the results to .uimax-history.json in the project directory. Use this to establish a baseline before making changes, so you can compare later.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the running application (e.g., http://localhost:3000) | |
| codeDir | No | Project directory for saving .uimax-history.json (defaults to cwd) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description carries full burden. It discloses that the tool runs multiple audits (screenshot, accessibility, performance, Lighthouse) and saves results to a specific file. It also notes it is free and runs within Claude Code. However, it does not mention prerequisites (e.g., app must be running) or failure modes.
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?
Three sentences, front-loaded with purpose, then details, then usage context. The promotional line about being free is slightly extraneous but does not detract. Overall efficient.
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 2 parameters, no output schema, and a description that explains what the tool does, its output file, and when to use it, the description is fairly complete. It could mention the connection to 'compare_to_baseline' but is adequate.
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 coverage is 100%, so the description adds value by explaining that `url` must be of a running application and that `codeDir` defaults to cwd. This provides context beyond the schema descriptions.
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 'Save' and the resource 'baseline snapshot', and explains it runs multiple audits. It implicitly differentiates from siblings like 'compare_to_baseline' by establishing a baseline, but does not explicitly distinguish from other audit tools like 'lighthouse_audit'.
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 usage context: 'Use this to establish a baseline before making changes, so you can compare later.' This implies when to use but does not mention when not to use or explicitly name alternative tools (e.g., 'compare_to_baseline' for comparison).
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
screenshotA
Capture a screenshot of a webpage. Returns a PNG image that you can visually analyze for design issues, layout problems, and UI quality.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to screenshot (e.g., http://localhost:3000) | |
| width | No | Viewport width in pixels | |
| height | No | Viewport height in pixels | |
| fullPage | No | Capture the full scrollable page | |
| delay | No | Wait time in ms after page load before capturing |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Without annotations, the description partially discloses behavior by stating it returns a PNG image, implying a read-only operation. However, it does not explicitly mention non-destructiveness, authentication needs, rate limits, or any side effects. The lack of such detail reduces trust, but the core behavior is clear enough for a simple capture.
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 sentence that front-loads the action verb and resource. Every word serves a purpose: 'Capture', 'screenshot', 'webpage', and the return value. It wastes no space, 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 tool has 5 parameters and no output schema, the description provides minimal context beyond 'returns a PNG image'. It does not explain the format (e.g., base64), the effect of parameters, or any edge cases. For a simple tool this is adequate but not comprehensive; missing details like timeout or error handling reduce completeness.
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?
Input schema coverage is 100%, so parameters are fully described structurally. The description adds no extra meaning beyond the schema. Baseline 3 is appropriate since the description does not need to compensate for missing schema details, but it also does not enhance parameter understanding.
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 captures a screenshot of a webpage, which is a specific verb+resource. It distinguishes from siblings like 'accessibility_audit' or 'lighthouse_audit' that perform different tasks. The addition of 'for design issues, layout problems, and UI quality' provides context without conflating with similar tools like 'responsive_screenshots'.
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 like 'responsive_screenshots', 'compare_screenshots', or 'lighthouse_audit'. There is no mention of prerequisites, when to avoid, or which sibling is better for specific scenarios. This leaves the agent without decision criteria.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
scrollA
Scroll the page by a pixel amount or to a specific element. Returns a screenshot after scrolling so you can visually verify the new viewport position.
| Name | Required | Description | Default |
|---|---|---|---|
| url | No | Optional URL to navigate to before scrolling | |
| direction | No | Scroll direction (default: 'down') | |
| amount | No | Pixels to scroll (default: 500) | |
| toSelector | No | CSS selector of element to scroll into view (overrides direction/amount) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided, so the description must disclose behavior. It adds that a screenshot is returned after scrolling, which is valuable. However, it omits details on scrolling behavior (smooth/instant), handling of iframes, error states for missing selectors, or effect of the url parameter.
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?
Two sentences packed with essential information: action (scroll), modes (pixel or element), and output (screenshot). No wasted words.
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 four optional parameters and no output schema, the description is mostly complete: it explains the two scroll modes and the screenshot return. Minor missing details like what happens if toSelector fails or if amount exceeds page length, but adequate for typical 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?
Input schema has 100% description coverage, so the baseline is 3. The description does not add extra meaning beyond the schema for parameters, but the overall purpose of returning a screenshot is separate.
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 scrolls by pixel amount or to an element and returns a screenshot. It distinguishes itself from siblings like navigate (which goes to URLs) and click (which interacts), but does not explicitly differentiate from any similar scrolling tool, as none exist.
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 scrolling is needed with visual verification, but lacks explicit 'when to use' vs 'when not to use' or alternatives. The presence of toSelector vs direction/amount suggests two modes, but no guidance on choosing between them.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
security_auditA
Check security posture via Lighthouse: HTTPS usage, mixed content, CSP headers, vulnerable JavaScript libraries, external links without noopener, and more. Returns pass/fail findings with severity levels.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to audit for security (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations provided. Description mentions using Lighthouse and returning pass/fail with severity, implying a read-only operation. However, it lacks details on permissions, rate limits, or side effects, leaving some behavioral aspects unspecified.
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 sentence with a clear list of checks, front-loaded with purpose and no extraneous 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?
With one parameter and no output schema or annotations, the description is largely complete. It covers the tool's purpose and output nature. Minor gap: does not explain severity levels or scoring format.
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 covers 100% of parameters with a description. The description adds context by specifying the URL format and linking it to security auditing, enhancing understanding beyond the schema.
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 checks security posture via Lighthouse, listing specific items (HTTPS, CSP, etc.) and returns pass/fail with severity. It distinguishes from sibling audit tools like performance_audit or seo_audit.
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 use for security auditing but does not explicitly state when to use it versus alternatives (e.g., performance_audit, seo_audit) or when not to use it. No exclusions or context provided.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
select_optionA
Select an option from a dropdown () element by value. Returns a screenshot after selection so you can visually verify the result.
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the <select> element (e.g., '#country', 'select[name="size"]') | |
| value | Yes | Value of the <option> to select | |
| url | No | Optional URL to navigate to before selecting |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Discloses that a screenshot is returned after selection, but does not discuss side effects, DOM mutations, or potential failures like disabled selects.
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?
Two sentences with no wasted words; first sentence states action, second adds behavioral detail.
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?
Describes the main action and return value, but does not cover error handling, edge cases, or the role of the optional URL parameter.
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 coverage is 100%, but the description adds no extra meaning to the parameters; it does not elaborate on selector format or value constraint.
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?
Clearly states the tool selects an option from a <select> element by value and returns a screenshot, distinguishing it from sibling tools like 'click' which is generic.
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?
Indicates the tool is for selecting from dropdowns by value, but does not provide when-not-to-use or mention alternatives like clicking the option directly.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
semantic_compareA
AI-powered visual comparison. Captures before/after screenshots and provides a structured methodology for Claude to semantically evaluate whether UI changes match the intended design request. Goes beyond pixel diffing to understand intent.
Returns both screenshots as images, a pixel-level diff image, the difference percentage, and a detailed semantic methodology prompt. Claude's vision analyzes the screenshots to determine if the changes match what was requested, checking for regressions and unintended side effects.
This tool is FREE — it runs entirely within Claude Code using the user's existing plan. No API keys needed.
| Name | Required | Description | Default |
|---|---|---|---|
| urlBefore | Yes | URL of the 'before' state (e.g., http://localhost:3000) | |
| urlAfter | Yes | URL of the 'after' state (e.g., http://localhost:3001) | |
| changeDescription | Yes | What was the intended change? (e.g., 'Changed the hero section background to a gradient and increased heading font size') | |
| width | No | Viewport width in pixels | |
| height | No | Viewport height in pixels |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description fully discloses that it is free, runs within Claude Code, requires no API keys, and returns screenshots, diff image, percentage, and a semantic prompt. It explains the use of Claude's vision. Missing details on error handling or prerequisites, but covers key behavioral traits.
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?
Two short paragraphs: first explains purpose and differentiation, second details return values and pricing. Every sentence adds value—no redundancy, tautology, or fluff. Front-loaded with 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?
The description explains return values, methodology, and cost model, which is good for a tool with no output schema. It lacks details on error handling (e.g., invalid URLs) or prerequisites (e.g., running servers), which are minor gaps. Overall, it provides sufficient context for usage.
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 each parameter's meaning. The description adds context for the overall workflow (e.g., changeDescription is for the intended change) but does not enhance individual parameter semantics beyond the schema. Baseline 3 is appropriate.
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 it does 'AI-powered visual comparison' for semantic evaluation of UI changes, differentiating from pixel diffing. It establishes a specific verb ('compare' implicitly) and resource (before/after screenshots with change description). Among siblings like compare_screenshots, compare_sites, and compare_to_baseline, it uniquely focuses on semantic intent.
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 clearly implies when to use—'to understand intent' and 'determine if changes match what was requested'—but does not explicitly say when not to use or name alternatives. However, the context is clear enough for an agent to choose this over pixel-based siblings.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
seo_auditA
Run a comprehensive SEO audit. Checks 18 SEO signals including meta tags, heading hierarchy, Open Graph tags, Twitter cards, structured data (JSON-LD), canonical URLs, image alt text, and more. Returns a 0-100 score and specific recommendations for each failing check.
Use this when the user wants to check their page's SEO health, improve search engine visibility, or ensure proper social sharing metadata.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to audit (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations, the description adds context: it checks 18 signals, returns score/recommendations, runs within Claude Code, and is FREE. It implies read-only behavior without stating destructive effects. No contradictions.
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?
Three well-structured sentences covering purpose, signals, usage guidance, and free status. No wasted words; front-loaded.
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 simple input (single URL), no output schema, and no annotations, the description sufficiently covers tool behavior, what it checks, and what it returns. Also notes it's free, which is helpful 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?
Schema coverage is 100% for the single parameter 'url'. The description does not add parameter-level details beyond the schema, but the schema itself is clear. Baseline 3 is appropriate.
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 runs a comprehensive SEO audit, lists 18 specific signals checked, and specifies the output (0-100 score and recommendations). This distinguishes it from sibling audit tools (e.g., accessibility_audit, performance_audit).
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?
Provides explicit guidance on when to use: checking SEO health, improving search visibility, or ensuring social sharing metadata. However, it does not explicitly exclude other scenarios or mention alternatives.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
type_textA
Type text into an input field or textarea by CSS selector. Returns a screenshot after typing so you can visually verify the result. Options to clear existing text first and press Enter after typing.
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the input element (e.g., 'input[name="email"]', '#search') | |
| text | Yes | Text to type into the element | |
| url | No | Optional URL to navigate to before typing | |
| clearFirst | No | Clear existing text before typing (default: false) | |
| pressEnter | No | Press Enter after typing (default: false) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations exist, so the description must carry the burden. It returns a screenshot and notes options, but does not disclose potential side effects (e.g., focus changes, waiting for element, typing speed). Basic behavioral traits are covered but not detailed.
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?
Two sentences with no wasted words. Information is front-loaded: purpose, return value, then options. Every sentence adds value.
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?
For a simple typing tool with no output schema, the description covers the purpose, return (screenshot), and all parameters. No missing information for correct 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?
Schema coverage is 100% with good descriptions. The description adds context beyond the schema by explaining the screenshot return and clarifying the optional boolean params, which aids understanding.
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 types text into an input field or textarea using a CSS selector, with a specific verb and resource. It differentiates from sibling tools like click, select_option, and scroll by focusing on text input.
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 for filling input fields and mentions optional behaviors (clear first, press Enter). It lacks explicit alternatives or when-not-to-use, but the context is clear enough for an agent to infer appropriate use.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
unused_codeA
Find unused JavaScript and CSS on a page. Runs Lighthouse and extracts the unused-javascript and unused-css-rules audits, showing each resource with total bytes, unused bytes, and potential savings. Great for reducing bundle size.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the page to analyze for unused code (e.g., http://localhost:3000) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
The description transparently states it runs Lighthouse and extracts specific audits, disclosing the method and output (resource bytes, savings). No annotations provided, but the description compensates by clearly describing 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 three sentences with no wasted words. It front-loads the purpose, then explains method, then provides benefit. Clean and efficient.
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 a single required parameter and no output schema, the description adequately explains what results to expect (resource details with bytes and savings). It does not specify response format, but is sufficient for the tool's simplicity.
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 defines a single 'url' parameter with a basic description. The tool description adds context by explaining that the URL is for a page to analyze, and that results include resource details, adding meaning beyond the schema.
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 it finds unused JavaScript and CSS on a page using Lighthouse audits, specifying exact resource details. It is specific and distinct from sibling tools like 'lighthouse_audit' which may run a full audit.
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 mentions 'Great for reducing bundle size' as a use case, but does not provide explicit guidance on when not to use it or compare to alternatives like 'resource_analysis' or 'performance_audit'.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
verify_fixesA
Re-run the full audit pipeline after fixes are applied and compare against the original review. Shows a before/after Report Card with grade transitions, resolved issues count, and remaining issues. Closes the review-fix-verify loop.
Use this AFTER implementing fixes from a review_ui run. Pass the same URL and code directory. The tool re-audits everything and shows what improved.
This tool is FREE — runs entirely within Claude Code.
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | URL of the running application (same URL used in the original review) | |
| codeDirectory | Yes | Absolute path to the frontend source directory | |
| width | No | Viewport width in pixels | |
| height | No | Viewport height in pixels |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Describes the outcome (grade transitions, resolved issues count) and that it closes the loop. With no annotations, the description bears the burden and does well, though it could mention side effects or data persistence. No contradiction with missing annotations.
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?
Four sentences, each earning its place: what it does, when to use, what to pass, and a cost note. Front-loaded with key action and output.
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?
With 4 params and no output schema, the description covers the return (Report Card with transitions, resolved/remaining issues). Could include error handling or prerequisites but sufficient for core behavior.
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 coverage is 100%, so baseline is 3. The description only mentions url and codeDirectory, not width/height, but schema already describes them. No added parameter meaning beyond schema.
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 re-runs the full audit pipeline and compares against the original review, showing a before/after Report Card. It uses specific verbs and resources, and the purpose is distinct from siblings like review_ui.
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?
Explicitly states 'Use this AFTER implementing fixes from a review_ui run' and instructs to pass the same URL and code directory. Also notes it's free and runs within Claude Code, providing clear when-to-use guidance.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
wait_forA
Wait for an element to appear in the DOM. Returns the element's tag name and text content when found. Use this to wait for dynamic content to load before interacting with it.
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the element to wait for | |
| url | No | Optional URL to navigate to before waiting | |
| timeout | No | Maximum wait time in ms (default: 10000) | |
| visible | No | Wait for element to be visible, not just in DOM (default: false) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Without annotations, the description must fully convey behavior. It explains waiting and return values, but omits details like timeout handling, failure conditions, or that it blocks execution. This is adequate but not comprehensive.
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 extremely concise with two sentences, each serving a clear purpose: describing the core action and providing usage advice. No unnecessary words.
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 moderate complexity (4 parameters, no output schema), the description covers the purpose, usage, and return values. It lacks details about default timeout or interplay between 'visible' and 'selector', but overall it is sufficient.
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 for all parameters, so the description adds no additional meaning beyond what the schema provides. The description's mention of return values is not parameter-specific.
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 ('Wait for an element') and resource ('in the DOM'), and specifies the return values (tag name and text content). It distinguishes itself from siblings like 'get_element' by emphasizing the dynamic waiting behavior.
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 explicitly advises using this tool 'before interacting with dynamic content', giving clear context. However, it does not mention when not to use it or provide alternatives, leaving some room for improvement.
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.
26 tool updates
v0.8.0- Added
capture_console - Added
capture_errors - Added
capture_network - Added
check_budgets - Added
click - Added
compare_sites - Added
compare_to_baseline - Added
crawl_and_review - Added
get_element - Added
get_review_history - Added
get_review_stats - Added
lcp_optimization - Added
navigate - Added
pwa_audit - Added
resource_analysis - Added
review_diff - Added
save_baseline - Added
scroll - Added
security_audit - Added
select_option - Added
semantic_compare - Added
seo_audit - Added
type_text - Added
unused_code - Added
verify_fixes - Added
wait_for
11 tool updates
v0.3.1- First observed
accessibility_audit - First observed
analyze_code - First observed
check_dark_mode - First observed
compare_screenshots - First observed
export_report - First observed
lighthouse_audit - First observed
performance_audit - First observed
quick_review - First observed
responsive_screenshots - First observed
review_ui - First observed
screenshot
TDQS
Scored across 37 tools
Many tools have overlapping purposes (e.g., multiple performance audits, multiple comparison tools, and a 'primary' review tool that subsumes many others). Agents will struggle to choose the correct tool due to redundant functionality and unclear boundaries.
Most tools follow a verb_noun pattern (e.g., capture_console, check_budgets), but some deviate (lcp_optimization, responsive_screenshots). Overall, the naming is readable and predictable, with only minor inconsistencies.
With 37 tools, the server is overly bloated for its domain. Many tools are highly specific (e.g., check_dark_mode) and could be merged. This volume increases cognitive load and reduces efficiency.
The tool set covers nearly all aspects of UI auditing: accessibility, performance, SEO, visual comparison, interaction testing, and reporting. Minor gaps exist (e.g., no dedicated mobile viewport testing beyond responsive screenshots), but overall it is comprehensive.
Maintenance
Related MCP Connectors
Live SEO workflow tools for Claude Code, Codex, and AI agents.
Validate HTML/CSS, audit SEO and JSON-LD, check links, and capture responsive screenshots.
Agent personas for Claude. 16 tools, 13 personas, 3 workflows. Zero extra API cost. Free.
Find what slows your website down. Run a free check in Claude Code, Cursor or ChatGPT. No account needed to try it. Save your result with a free Nimo account, then check again after your fixes. No card needed. Learn more: https://heynimo.com/for/coding-assistants
Related MCP Servers
- 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.423MIT
- FlicenseNot gradedqualityNot gradedmaintenanceProvides AI assistants with advanced frontend debugging capabilities through 36 specialized tools for inspecting React/Vue/Angular/Svelte applications. Uses Playwright browser automation and source map intelligence to analyze components, network requests, bundle optimization, and resolve production errors.-
- AlicenseAqualityDmaintenanceCore Web Vitals analysis powered by Lighthouse. Four tools: analyze a URL, compare two URLs, check against thresholds, or crawl an entire site. Works with Claude Code, Cursor, Windsurf, and any MCP-compatible AI tool.49 npmMIT
- FlicenseAqualityDmaintenanceEnables Claude Code to capture and analyze web page screenshots, responsive layouts, and page metadata using Puppeteer. It allows developers to perform visual UI inspections and compare designs across various viewports directly within the terminal.3-