Glama
Sign In

AI Vision Debug MCP Server

by samihalawa
GitHub
JavaScript
RedditDiscord
OverviewInspectSchemaRelated ServersReviewsScore
Need Help?View Source CodeReport Issue

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

# Clone the repository git clone https://github.com/samihalawa/mcp-server-ai-vision.git cd mcp-server-ai-vision # Install dependencies npm install # Build the server npm run build

Usage

Starting the Server

npm start

Configuration

Add the server to your MCP configuration:

{ "servers": { "ai-vision": { "command": "/path/to/node", "args": ["/path/to/mcp-server-ai-vision/build/index.js"], "enabled": true, "port": 3005, "environment": { "NODE_PATH": "/path/to/node_modules", "PATH": "/usr/local/bin:/usr/bin:/bin", "GEMINI_API_KEY": "your-gemini-api-key" } } } }

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: false
  • waitForSelector (string, optional): CSS selector to wait for before taking screenshot
  • waitTime (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 file
  • startLine (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 file
  • startLine (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 tested
  • appName (string, optional): Name of the application being analyzed
  • date (string, optional): Date of the analysis (YYYY-MM-DD)
  • observations (object): Observations structured as components, data state, interactions, etc.

Example Workflow

  1. Take a screenshot of a website:
    screenshot_url(url: "https://example.com")
  2. Analyze the screenshot:
    analyze_screen()
  3. Generate a report based on the analysis:
    generate_report(testUrl: "https://example.com", observations: {...})

Requirements

  • Node.js 14+
  • Playwright for browser automation
  • Gemini API key for AI vision analysis

License

MIT

This server cannot be installed

-
security - not tested
F
license - not found
-
quality - not tested

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.

  1. Features
    1. Installation
      1. Usage
        1. Starting the Server
          1. Configuration
            1. Available Tools
              1. screenshot_url
                1. analyze_screen
                  1. read_file
                    1. modify_file
                      1. generate_report
                    2. Example Workflow
                      1. Requirements
                        1. License

                          Related Resources