AI Vision Debug MCP Server
local-only server
The server can only run on the client’s local machine because it depends on local resources.
AI Vision MCP Server
A Model Context Protocol (MCP) server that provides AI-powered visual analysis capabilities for Claude and other MCP-compatible AI assistants.
Features
- Screenshot URL: Capture screenshots of any website by providing a URL
- Visual Analysis: Analyze UI elements, layouts, and content in screenshots
- File Operations: Read and modify files with line-specific precision
- Report Generation: Create comprehensive UI/UX analysis reports
- Debugging Session: Maintain context across multiple analysis steps
Installation
Usage
Starting the Server
Configuration
Add the server to your MCP configuration:
Available Tools
screenshot_url
Take a screenshot of a URL using a web browser.
Parameters:
url
(string, required): URL to capture a screenshot of (e.g., http://localhost:4999, https://google.com)fullPage
(boolean, optional): Whether to capture full page or just viewport. Default: falsewaitForSelector
(string, optional): CSS selector to wait for before taking screenshotwaitTime
(number, optional): Time to wait in milliseconds before taking screenshot. Default: 1000
analyze_screen
Analyze a screenshot with AI vision.
Parameters: None (uses the most recent screenshot)
read_file
Read content from a file between specified line numbers.
Parameters:
path
(string): Path to the filestartLine
(number): Starting line number (1-indexed)endLine
(number): Ending line number (1-indexed)
modify_file
Modify content in a file between specified line numbers.
Parameters:
path
(string): Path to the filestartLine
(number): Starting line number to replace (1-indexed)endLine
(number): Ending line number to replace (1-indexed)content
(string): New content to replace the specified lines
generate_report
Generate a comprehensive UI/UX analysis report.
Parameters:
testUrl
(string): URL of the application being testedappName
(string, optional): Name of the application being analyzeddate
(string, optional): Date of the analysis (YYYY-MM-DD)observations
(object): Observations structured as components, data state, interactions, etc.
Example Workflow
- Take a screenshot of a website:Copy
- Analyze the screenshot:Copy
- Generate a report based on the analysis:Copy
Requirements
- Node.js 14+
- Playwright for browser automation
- Gemini API key for AI vision analysis
License
MIT
This server cannot be installed
A Model Context Protocol server that provides AI vision capabilities for analyzing UI screenshots, offering tools for screen analysis, file operations, and UI/UX report generation.