RenderLens

MCP Server for Claude, Cursor & AI agents

Give your AI agent eyes to verify what it builds

RenderLens renders, audits, and diffs UI code in real time. Your AI sees exactly what users will see — pixel by pixel.

100 free calls/month — no signup needed. Just point your AI agent and go.

Screenshot of your HTML/React code. See what users will see.

Lighthouse + WCAG accessibility scores in one call.

Pixel-level visual diff between two code versions.

Your AI writes UI code but can't see the result. RenderLens fixes that.

One command and you're live. No Playwright to install, no browser to manage, no Docker to configure.

Fast enough for iterative loops. Write code, render, fix, re-render — all in a single conversation.

Tailwind CSS classes work out of the box. Inject your project's CSS variables and Google Fonts too.

Your code is processed in memory and discarded immediately. Nothing is logged or persisted.

Three tools. Complete visual verification.

Each tool is designed for a specific step in the AI coding workflow.

Takes HTML or React code and returns a JPEG screenshot. Supports custom viewports, full-page capture, and quality settings.

- ✓ Auto-detects HTML vs React
- ✓ npm packages via CDN
- ✓ Console errors captured

// AI agent calls render tool { "code": "<div class='card'>...</div>", "viewport": { "width": 1280 }, "quality": 80 } // Returns: JPEG screenshot + metadata

Runs Lighthouse and axe-core accessibility audit. Returns scores, WCAG violations with severity and remediation hints.

- ✓ WCAG 2.1 A/AA/AAA
- ✓ Lighthouse categories
- ✓ Actionable fix suggestions

// Audit response { "lighthouse": { "accessibility": 100 }, "wcag": { "violationsCount": 0, "passesCount": 12 }, "summary": "PASS: No violations" }

Compares two code versions pixel by pixel. Returns a diff image highlighting changes and a percentage metric.

- ✓ Pixel-level precision
- ✓ Configurable threshold
- ✓ Visual regression detection

// Diff response { "diffPercentage": 3.2, "diffPixels": 29491, "verdict": "CHANGED: 3.2% differ" } // + diff image overlay

Copy the snippet below into your MCP client. No API key needed for trial.

Render, audit, and diff immediately. No signup, no credit card.

100 calls/month free during beta. Paid plans coming soon.

$ claude mcp add renderlens --transport http https://app.renderlens.dev/mcp

Or add to Cursor, Windsurf, or any MCP client config:

{ "mcpServers": { "renderlens": { "type": "streamable-http", "url": "https://app.renderlens.dev/mcp" } } }

This is a web browser that enables your coding agent, such as Claude Code, to visit websites on your behalf and assist you in identifying bugs or creating UI test cases.

Browser automation via MCP for Chrome and Firefox

Bring the full power of BrowserStack’s Test Platform to your AI tools, making testing faster and easier for every developer and tester on your team.

Official Chrome DevTools MCP server for controlling and inspecting a live Chrome browser from coding agents such as Gemini, Claude, Cursor, and Copilot.

AI 測試大師 — MCP server driving pytest / Jest / Cypress / Go / Maestro. Analyze, generate, run, advise. Web + Mobile (iOS/Android/BlueStacks).

A Playwright-based MCP server that exposes a live browser as a traceable, inspectable, debuggable and controllable execution environment for AI agents.

This MCP allows you to record browser interactions with a chrome extension that include screenshots and console logs. The data is then saved to a local database that feeds the data to an AI system like claude code to search.

Control Chrome with debugging capabilities, userscript injection, and extension support.

Drive Electron apps from AI agents via MCP - click, type, drag, screenshot, eval JS, and more.

AI-powered E2E testing for 10 platforms. 253 MCP tools. Zero config. Test Flutter, React Native, iOS, Android, Web, Electron, Tauri, KMP, .NET MAUI from natural language.

Programmatically control Windows mouse, keyboard, window management, screen capture, and clipboard operations.