RenderLens
Visual verification MCP server — render code to screenshots, run WCAG accessibility audits, and pixel-diff UI changes. Free, no API key.
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.
Get Started Free See How It Works
100 free calls/month — no signup needed. Just point your AI agent and go.
📸
render()
Screenshot of your HTML/React code. See what users will see.
♿
audit()
Lighthouse + WCAG accessibility scores in one call.
🔀
diff()
Pixel-level visual diff between two code versions.
Three tools. Complete visual verification.
Each tool is designed for a specific step in the AI coding workflow.
Render
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
Audit
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"
}
Diff
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
Get started in 3 steps
1
Add the config
Copy the snippet below into your MCP client. No API key needed for trial.
2
Try 100 free calls
Render, audit, and diff immediately. No signup, no credit card.
3
Build with confidence
100 calls/month free during beta. Paid plans coming soon.
MCP config
Add to Claude Code, Cursor, or any MCP client — no signup needed
{
"mcpServers": {
"renderlens": {
"type": "streamable-http",
"url": "https://app.renderlens.dev/mcp"
}
}
}
Free during beta
Try RenderLens free. Paid plans coming soon.
Free Beta
Beta
Free
100 calls/month
- ✓ 100 free calls/month — no signup needed
- ✓ All 3 tools included (render, audit, diff)
- ✓ No API key required
- ✓ No credit card required Get Started
Paid plans with higher limits coming soon.
Máy chủ liên quan
Scout Monitoring MCP
nhà tài trợPut performance and error data directly in the hands of your AI assistant.
Alpha Vantage MCP Server
nhà tài trợAccess financial market data: realtime & historical stock, ETF, options, forex, crypto, commodities, fundamentals, technical indicators, & more
Criage MCP Server
An MCP server for the Criage package manager, providing full client functionality via the MCP protocol.
Rust Docs MCP Server
Query up-to-date documentation for Rust crates.
Sui Butler
An MCP server for the Sui blockchain ecosystem that bridges AI intelligence for simplified development. Supports both zkLogin and Private Key modes.
Godot MCP
MCP server for interacting with the Godot game engine, providing tools for editing, running, debugging, and managing scenes in Godot projects.
Ai Notify MCP
Receive system notifications in your code editor when an AI response is complete.
VSCode MCP Server
A VSCode extension that acts as an MCP server, providing access to diagnostic tools and debug session management.
Cloudflare Remote MCP Server
A remote MCP server example deployable on Cloudflare Workers without authentication.
velixar-mcp-server
Persistant AI Memory
Mermaid
Generate mermaid diagram and chart with AI MCP dynamically.
MCP Proxy Server
Aggregates multiple MCP resource servers into a single interface.