概要
What is AI Vision MCP Server?
An MCP server that provides AI-powered visual analysis capabilities for Claude and other MCP-compatible AI assistants. It captures website screenshots, analyzes UI elements and layouts, reads and modifies files line-specifically, and generates comprehensive UI/UX reports while maintaining context across multiple analysis steps.
How to use AI Vision MCP Server?
Clone the repository, install dependencies with npm install, build with npm run build, then start with npm start. Configure the server in your MCP config by specifying the node command, path to build/index.js, and setting the GEMINI_API_KEY environment variable. Use tools like screenshot_url, analyze_screen, read_file, modify_file, and generate_report to interact with the server.
Key features of AI Vision MCP Server
- Capture screenshots of any website by URL
- Analyze UI elements and layouts with AI vision
- Read and modify files with line-specific precision
- Generate comprehensive UI/UX analysis reports
- Maintain context across multiple analysis steps
Use cases of AI Vision MCP Server
- Testing web application UIs and layouts automatically
- Debugging visual issues by analyzing screenshots
- Generating structured UI/UX reports for reviews
- Assisting with file modifications during development
FAQ from AI Vision MCP Server
What runtime and dependencies are required?
Node.js 14+, Playwright for browser automation, and a Gemini API key for AI vision analysis.
How do I configure the server?
Add a JSON entry to your MCP config with the correct node path, server build path, set GEMINI_API_KEY, and optionally configure port 3005.
What tools are available in this server?
screenshot_url, analyze_screen, read_file, modify_file, and generate_report.
Can I capture full page screenshots?
Yes, set the fullPage parameter to true when using screenshot_url; it also supports waiting for a CSS selector or a custom delay.
Does it work with local URLs?
Yes, the screenshot_url tool accepts local URLs such as http://localhost:4999.
