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.
Verwandte Server
Scout Monitoring MCP
SponsorPut performance and error data directly in the hands of your AI assistant.
Alpha Vantage MCP Server
SponsorAccess financial market data: realtime & historical stock, ETF, options, forex, crypto, commodities, fundamentals, technical indicators, & more
ABP.IO MCP Server
An MCP server for ABP.IO that enables AI models to interact with your ABP applications and framework.
HeyBeauty
Perform virtual try-ons using the HeyBeauty API.
Scorecard
Access Scorecard's AI model evaluation and testing tools via a Cloudflare Workers deployment.
MCP Shell
Execute secure shell commands from AI assistants and other MCP clients, with configurable security settings.
Wrapping MCP server with Express
A simple example of wrapping an MCP server with Express for web integration.
Drupal Tools
A server providing resources, tools, and prompts for Drupal development.
Any OpenAPI
A server that dynamically creates MCP endpoints from any OpenAPI specification URL.
MLflow MCP Server
Integrates with MLflow, enabling AI assistants to interact with experiments, runs, and registered models.
Loop MCP Server
Enables LLMs to process array items sequentially with a specific task.
MCP Tree-sitter Server
A server for code analysis using Tree-sitter, with context management capabilities.