Skip to main content
Glama

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:

  1. Sees your app — captures a real screenshot via Puppeteer

  2. Audits accessibility — runs axe-core for WCAG 2.1 violations

  3. Runs Lighthouse — real Google Lighthouse scores (Performance, Accessibility, Best Practices, SEO)

  4. Measures performance — captures Core Web Vitals (FCP, LCP, CLS, TBT)

  5. Audits SEO — 18 checks: meta tags, Open Graph, Twitter cards, structured data, heading hierarchy, canonical URLs

  6. Scans your code — AST-based analysis for 25+ anti-patterns across accessibility, design, and code quality

  7. Grades everything — per-section Report Card with letter grades (A+ through F) for Accessibility, Performance, Best Practices, SEO, and Code Quality

  8. Generates an expert review — Claude acts as a senior frontend engineer with a baked-in review methodology

  9. Implements the fixes — edits your actual code files, starting from critical issues down

  10. Tracks everything — auto-saves review history so you can see progress over time

Works on any URL — localhost, staging, production. Any site your machine can reach.

Free for all Claude Code users (Pro plan and above). No API keys. No extra costs. Just install and go.

claude mcp add uimax -- npx -y uimax-mcp

Quick Start

Install as MCP Server (for Claude Code)

# Add to Claude Code — that's it, no API keys needed
claude mcp add uimax -- npx -y uimax-mcp

That'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 tracking

Install Globally

npm install -g uimax-mcp

Related MCP server: WebSee MCP Server

Tools (37)

Review Pipeline

Tool

Description

review_ui

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.

verify_fixes

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.

compare_sites

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.

quick_review

Fast design-only review. Screenshot + focused design methodology. No code analysis or performance audit.

export_report

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

screenshot

Capture a high-resolution PNG screenshot of any URL.

responsive_screenshots

Screenshots at mobile (375px), tablet (768px), and desktop (1440px) viewports.

check_dark_mode

Compare light mode vs dark mode (emulated). Returns both screenshots + difference percentage.

compare_screenshots

Pixel-level diff using pixelmatch. Returns both screenshots + red-highlighted diff image + exact pixel difference %.

semantic_compare

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

lighthouse_audit

Full Google Lighthouse audit — Performance, Accessibility, Best Practices, SEO scores + failing audits.

seo_audit

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_audit

PWA readiness: installable, service worker, HTTPS, manifest, offline capability.

security_audit

Security analysis: HTTPS, CSP, mixed content, vulnerable JS libraries, external links without noopener.

unused_code

Find unused JavaScript and CSS with exact byte savings per resource.

lcp_optimization

Deep LCP analysis: what the element is, resource load time, render delay, TTFB, optimization suggestions.

resource_analysis

Full resource breakdown by type, transfer sizes, request count, top 10 largest, render-blocking resources.

performance_audit

Core Web Vitals via Performance API: FCP, LCP, CLS, TBT, DOM node count, JS heap size.

accessibility_audit

axe-core WCAG 2.1 Level A & AA audit. Violations grouped by severity with fix instructions.

Code Analysis

Tool

Description

analyze_code

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 .uimaxrc.json.

Browser Interaction

Tool

Description

navigate

Navigate to a URL, wait for network idle. Returns page info + screenshot.

click

Click an element by CSS selector. Returns screenshot after click.

type_text

Type into input fields. Options: clearFirst, pressEnter. Returns screenshot after.

select_option

Select a dropdown option by value. Returns screenshot after.

scroll

Scroll by pixel amount or to a specific element. Returns screenshot after.

wait_for

Wait for an element to appear in the DOM. Returns tag name and text content.

get_element

Get element details: attributes, bounding box, computed styles, visibility.

Debugging

Tool

Description

capture_console

Capture all console messages (log, warn, error, info, debug) + uncaught exceptions during page load.

capture_network

Capture all network requests with status, size, timing, resource type. Summary grouped by type.

capture_errors

Capture JS exceptions, unhandled rejections, and failed resource loads.

Multi-Page

Tool

Description

crawl_and_review

Discover internal links from a URL and audit up to 10 pages — screenshot + axe-core + performance each.

Baselines & Budgets

Tool

Description

save_baseline

Save current audit state to .uimax-history.json. Track scores over time.

compare_to_baseline

Compare current state vs previous baseline. Shows improvements and regressions with letter grade transitions (e.g., "D -> B+ (+22)").

check_budgets

Enforce performance budgets from .uimaxrc.json. Pass/fail for Lighthouse scores, Web Vitals, violation counts.

Review History

Tool

Description

get_review_history

View past UIMax reviews for this project. Filter by URL, limit count. Now includes letter grades alongside scores.

get_review_stats

Aggregate statistics: total reviews, score trends, most common issues, most problematic files. Includes Code Quality grades.

review_diff

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_ui output — Report Card table at the top of every review

  • export_report HTML — 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

react-hooks-conditional

Hooks inside nested if/for/while/ternary — proper scope traversal

missing-key-prop

.map() callbacks returning JSX without key — handles arrow/block bodies

empty-catch

Empty catch blocks — not fooled by comments

any-type

any in type positions only — ignores "any" in strings/comments

direct-dom-access

document.querySelector etc. — proper call expression matching

console-log

console.log/warn/error — not fooled by variable names containing "console"

inline-style

JSX style={} attributes — proper attribute detection

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 analysis

  • budgets — Performance thresholds enforced by the check_budgets tool

UIMax searches for .uimaxrc.json in the target directory and up to 3 parent directories, so it works in monorepos.


Prompts

Expert review prompts that guide Claude's analysis:

Prompt

Use Case

ui-review

Comprehensive review (design + UX + a11y + perf + code)

responsive-review

Responsive design review across viewports

quick-design-review

Fast visual/UX feedback from a screenshot only

semantic-compare

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: ✅ IMPROVED

Competitive 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

img-no-alt

High

Accessibility

click-no-keyboard

High

Accessibility

no-form-label

High

Accessibility

missing-viewport-meta

High

Accessibility

no-lang-attr

Medium

Accessibility

no-focus-visible

Medium

Accessibility

empty-catch

High

Code Quality

react-hooks-conditional

High

Code Quality

missing-key-prop

High

Bug

console-log

Low

Code Quality

todo-fixme

Low

Code Quality

inline-style

Medium

Code Quality

any-type

Medium

Code Quality

magic-number

Low

Code Quality

direct-dom-access

Medium

Code Quality

event-handler-inline

Low

Code Quality

important-css

Medium

Design

hardcoded-color

Low

Design

z-index-high

Medium

Design

font-too-small

Medium

Design

no-lazy-image

Medium

Performance

large-bundle-import

Medium

Performance

no-error-boundary

Medium

UX

missing-meta-description

Medium

UX

large-file

Medium/High

Code Quality

deep-nesting

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: 0

Action Inputs

Input

Description

Required

Default

url

URL to audit

Yes

github-token

Token for PR comments

No

GITHUB_TOKEN

budget-performance

Min performance score (0-100)

No

budget-accessibility

Min accessibility score (0-100)

No

budget-seo

Min SEO score (0-100)

No

max-violations

Max allowed a11y violations

No

fail-on-regression

Fail if grades regress

No

false

Action Outputs

Output

Description

accessibility-grade

Letter grade (A+ through F)

performance-grade

Letter grade

seo-grade

Letter grade

total-violations

Accessibility violation count

passed

Whether all budgets passed (true/false)

report

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.js

Contributing

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 tools
accessibility_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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to audit

TDQS

A3.6/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines2/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
directoryYesAbsolute path to the frontend source directory (e.g., /Users/me/project/src)

TDQS

B3.3/5.0
Behavior2/5

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.

Conciseness4/5

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.

Completeness2/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to capture console logs from (e.g., http://localhost:3000)
waitMsNoTime in ms to wait after page load for additional console messages (default 3000)

TDQS

A3.7/5.0
Behavior4/5

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.

Conciseness4/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose4/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to capture errors from (e.g., http://localhost:3000)

TDQS

A3.6/5.0
Behavior2/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to capture network requests from (e.g., http://localhost:3000)
waitMsNoTime in ms to wait after page load for additional network activity (default 3000)

TDQS

A3.9/5.0
Behavior3/5

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.

Conciseness4/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the running application (e.g., http://localhost:3000)
codeDirNoProject directory containing .uimaxrc.json with budget config (defaults to cwd)

TDQS

A4.2/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters4/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to check

TDQS

A4.2/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
selectorYesCSS selector of the element to click (e.g., 'button.submit', '#login-btn')
urlNoOptional URL to navigate to before clicking
waitAfterNoOptional milliseconds to wait after clicking (for animations/transitions)

TDQS

A4/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlAYesFirst URL — the 'before' state (e.g., http://localhost:3000)
urlBYesSecond URL — the 'after' state (e.g., http://localhost:3001)
widthNoViewport width in pixels
heightNoViewport height in pixels

TDQS

A4.4/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters4/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlAYesFirst URL to audit (e.g., http://localhost:3000 or https://mysite.com)
urlBYesSecond URL to audit (e.g., https://competitor.com)

TDQS

A4/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the running application (e.g., http://localhost:3000)
codeDirNoProject directory containing .uimax-history.json (defaults to cwd)

TDQS

A4.3/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness5/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesStarting URL to crawl from (e.g., http://localhost:3000)
maxPagesNoMaximum number of pages to audit (1-10, default 5)
codeDirNoOptional code directory path (reserved for future use)

TDQS

A4.6/5.0
Behavior5/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters4/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the running application (e.g., http://localhost:3000)
codeDirectoryYesAbsolute path to the frontend source directory (e.g., /Users/me/project/src)
outputPathNoOutput file path for the HTML report (defaults to ./uimax-report.html)

TDQS

A4/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
selectorYesCSS selector of the element to inspect
urlNoOptional URL to navigate to before inspecting

TDQS

A4/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
codeDirNoProject directory containing .uimax-reviews.json (defaults to cwd)
limitNoMaximum number of reviews to return (default 10)
urlNoFilter reviews by URL

TDQS

A4.2/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
codeDirNoProject directory containing .uimax-reviews.json (defaults to cwd)

TDQS

A3.8/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to analyze LCP (e.g., http://localhost:3000)

TDQS

A3.9/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness5/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to audit (e.g., http://localhost:3000)

TDQS

A4/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to measure

TDQS

B3.4/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose4/5

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.

Usage Guidelines2/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to check for PWA readiness (e.g., http://localhost:3000)

TDQS

A3.8/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to review

TDQS

A3.9/5.0
Behavior3/5

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.

Conciseness4/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to analyze resources (e.g., http://localhost:3000)

TDQS

B3.2/5.0
Behavior2/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose4/5

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.

Usage Guidelines2/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to capture

TDQS

A3.7/5.0
Behavior2/5

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.

Conciseness5/5

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.

Completeness3/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
codeDirNoProject directory containing .uimax-reviews.json (defaults to cwd)
reviewIdAYesID of the older review to compare
reviewIdBYesID of the newer review to compare (or 'latest' for the most recent review)

TDQS

A3.6/5.0
Behavior3/5

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.

Conciseness4/5

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.

Completeness3/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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:

  1. Study the screenshot carefully for visual/UX issues

  2. Analyze the audit data following the expert methodology provided

  3. Generate a comprehensive review with SPECIFIC fixes (exact CSS values, code changes)

  4. 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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the running application (e.g., http://localhost:3000)
codeDirectoryYesAbsolute path to the frontend source directory (e.g., /Users/me/project/src)
widthNoViewport width in pixels
heightNoViewport height in pixels

TDQS

B3.4/5.0
Behavior3/5

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.

Conciseness3/5

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.

Completeness2/5

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.

Parameters3/5

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.

Purpose4/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the running application (e.g., http://localhost:3000)
codeDirNoProject directory for saving .uimax-history.json (defaults to cwd)

TDQS

A3.8/5.0
Behavior4/5

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.

Conciseness4/5

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.

Completeness4/5

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.

Parameters4/5

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.

Purpose4/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to screenshot (e.g., http://localhost:3000)
widthNoViewport width in pixels
heightNoViewport height in pixels
fullPageNoCapture the full scrollable page
delayNoWait time in ms after page load before capturing

TDQS

A3.5/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness3/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines2/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlNoOptional URL to navigate to before scrolling
directionNoScroll direction (default: 'down')
amountNoPixels to scroll (default: 500)
toSelectorNoCSS selector of element to scroll into view (overrides direction/amount)

TDQS

A3.6/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose4/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to audit for security (e.g., http://localhost:3000)

TDQS

A4/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters4/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
selectorYesCSS selector of the <select> element (e.g., '#country', 'select[name="size"]')
valueYesValue of the <option> to select
urlNoOptional URL to navigate to before selecting

TDQS

A3.7/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness3/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlBeforeYesURL of the 'before' state (e.g., http://localhost:3000)
urlAfterYesURL of the 'after' state (e.g., http://localhost:3001)
changeDescriptionYesWhat was the intended change? (e.g., 'Changed the hero section background to a gradient and increased heading font size')
widthNoViewport width in pixels
heightNoViewport height in pixels

TDQS

A4.2/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to audit (e.g., http://localhost:3000)

TDQS

A4.3/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness5/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
selectorYesCSS selector of the input element (e.g., 'input[name="email"]', '#search')
textYesText to type into the element
urlNoOptional URL to navigate to before typing
clearFirstNoClear existing text before typing (default: false)
pressEnterNoPress Enter after typing (default: false)

TDQS

A4.3/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness5/5

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.

Parameters4/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the page to analyze for unused code (e.g., http://localhost:3000)

TDQS

A4.2/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters4/5

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.

Purpose5/5

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.

Usage Guidelines3/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL of the running application (same URL used in the original review)
codeDirectoryYesAbsolute path to the frontend source directory
widthNoViewport width in pixels
heightNoViewport height in pixels

TDQS

A4.4/5.0
Behavior4/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines5/5

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.

ParametersJSON Schema
NameRequiredDescriptionDefault
selectorYesCSS selector of the element to wait for
urlNoOptional URL to navigate to before waiting
timeoutNoMaximum wait time in ms (default: 10000)
visibleNoWait for element to be visible, not just in DOM (default: false)

TDQS

A4/5.0
Behavior3/5

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.

Conciseness5/5

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.

Completeness4/5

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.

Parameters3/5

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.

Purpose5/5

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.

Usage Guidelines4/5

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.

  1. 26 tool updatesv0.8.0
    • Addedcapture_console
    • Addedcapture_errors
    • Addedcapture_network
    • Addedcheck_budgets
    • Addedclick
    • Addedcompare_sites
    • Addedcompare_to_baseline
    • Addedcrawl_and_review
    • Addedget_element
    • Addedget_review_history
    • Addedget_review_stats
    • Addedlcp_optimization
    • Addednavigate
    • Addedpwa_audit
    • Addedresource_analysis
    • Addedreview_diff
    • Addedsave_baseline
    • Addedscroll
    • Addedsecurity_audit
    • Addedselect_option
    • Addedsemantic_compare
    • Addedseo_audit
    • Addedtype_text
    • Addedunused_code
    • Addedverify_fixes
    • Addedwait_for
  2. 11 tool updatesv0.3.1
    • First observedaccessibility_audit
    • First observedanalyze_code
    • First observedcheck_dark_mode
    • First observedcompare_screenshots
    • First observedexport_report
    • First observedlighthouse_audit
    • First observedperformance_audit
    • First observedquick_review
    • First observedresponsive_screenshots
    • First observedreview_ui
    • First observedscreenshot

TDQS

B3.4/5.0

Scored across 37 tools

Disambiguation2/5

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.

Naming Consistency4/5

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.

Tool Count2/5

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.

Completeness4/5

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

ActivityInactive
ResponsivenessNo issues

Related MCP Connectors

Related MCP Servers

  • A
    license
    B
    quality
    D
    maintenance
    Provides 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.
    4
    23
    MIT
  • F
    license
    Not graded
    quality
    Not graded
    maintenance
    Provides 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.
    -
  • A
    license
    A
    quality
    D
    maintenance
    Core 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.
    4
    9 npm
    MIT
  • F
    license
    A
    quality
    D
    maintenance
    Enables 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
    -