Log inSubmit server
AI Vision MCP logo

AI Vision MCP

by tan-yong-sheng

Analyzes images and videos with Gemini or Vertex AI for UI review, visual comparison, and design-system inspection.

InstallRepositoryWebsite
Full README Compare alternatives Embed widget Claim this listing

Install AI Vision MCP

Pick your client, then add it in one click or paste the config.

STDIONode.js
~/Library/Application Support/Claude/claude_desktop_config.json
claude_desktop_config.json
{
  "mcpServers": {
    "tan-yong-sheng-ai-vision-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "ai-vision-mcp"
      ],
      "env": {
        "IMAGE_PROVIDER": "YOUR_VALUE_HERE",
        "VIDEO_PROVIDER": "YOUR_VALUE_HERE",
        "GEMINI_API_KEY": "YOUR_VALUE_HERE",
        "VERTEX_CLIENT_EMAIL": "YOUR_VALUE_HERE",
        "VERTEX_PRIVATE_KEY": "YOUR_VALUE_HERE",
        "VERTEX_PROJECT_ID": "YOUR_VALUE_HERE",
        "GCS_BUCKET_NAME": "YOUR_VALUE_HERE"
      }
    }
  }
}

Settings → Developer → Edit Config, merge this into mcpServers, then fully quit and reopen Claude Desktop.

Values are written into the snippet above so you can paste it as is. They never leave your browser.

Automated check passed— started and listed 4 tools correctly (25d ago).

Overview

tan-yong-sheng/ai-vision-mcp MCP server analyzes image and video content through Google Gemini or Vertex AI. It accepts URLs, local paths, and base64 data, and exposes image analysis, image comparison, design-token extraction, visual hierarchy review, and component inventory capabilities. Reach for it when an MCP client needs visual regression checks, UI/UX evaluation, or structured understanding of interface screenshots.

Use cases

  • Evaluate UI screenshots for visual hierarchy
  • Compare release screenshots for visual regressions
  • Extract design tokens from interface images
  • Inventory UI components in a design system
  • Analyze image or video content with Google AI models

Key features

  • Google Gemini and Vertex AI provider support
  • Image and video analysis
  • URL, local-file, and base64 input
  • Image comparison for two to four sources
  • Design-token, hierarchy, and component analysis
  • Standard stdio MCP transport

Tools4

What AI Vision MCP lets your agent do. Expand a tool for its parameters.

Verified live~1.7k tokens of context

Security & health

What it can reach and how reliably it runs — from our own checks, not the maintainer’s claims.

ActiveLast checked 1d ago

Recent health check succeeded.

7/8 checks healthy over the last 79d

Supply-chain signal

No high-severity advisories surfaced by our automated scan.

Critical 0High 0Medium 0Low 0

Scanned 10d ago via OSV.dev · ai-vision-mcp (npm)

Adoption & maintenance

Factual signals from GitHub, npm, and our automated checks — not a rating.

GitHub stars80Stargazers on the source repository.
npm downloads195Package downloads in the last 30 days.
Last commit6mo agoMost recent push to the default branch.
Availability100%Our rolling endpoint + install checks that succeeded.
Install checkPassedOur sandbox started it and listed its tools.
Tools exposed4Callable tools this server registers over MCP.
Directory activity6 viewsConfig copies, upvotes, and views on AllMCPs.

How AI Vision MCP works

What tan-yong-sheng/ai-vision-mcp MCP server does

tan-yong-sheng/ai-vision-mcp MCP server brings multimodal image and video analysis into MCP-compatible clients. It connects to either the Google AI Studio Gemini API or Google Vertex AI, selected separately for image and video processing through environment variables.

The server is suited to interface review and visual inspection tasks. It can describe image content, compare multiple images, extract design tokens, assess visual hierarchy and eye flow, and inventory UI components while considering design-system maturity. These capabilities can support screenshot review, visual regression analysis, and UI/UX evaluation.

How it works

The server runs over standard stdio transport and can be started with npx ai-vision-mcp. An MCP client sends a tool request with one or more image sources, a natural-language prompt, and optional analysis settings. Sources may be remote URLs, local file paths, or base64-encoded data.

Image analysis accepts one source and supports general analysis plus palette, hierarchy, and components modes. The implementation uses Zod validation, retry handling, and circuit-breaker behavior, according to the project documentation.

Setup and configuration

Choose Google AI Studio by setting both provider variables to google and providing GEMINI_API_KEY. For Vertex AI, set both provider variables to vertex_ai and provide service-account details through VERTEX_CLIENT_EMAIL, VERTEX_PRIVATE_KEY, and VERTEX_PROJECT_ID. Vertex AI setup also requires GCS_BUCKET_NAME for Google Cloud Storage.

The README provides configurations for Claude Desktop, Claude Code, Cursor, and Cline. Other MCP-compatible clients can use the same stdio command. The examples recommend allowing more than five minutes for tool execution. Claude Code users are specifically advised to set a 60-second startup timeout and a 300-second tool timeout.

Tools and capabilities

The documented tools include:

  • analyze_image: Sends an image and prompt for general analysis or a selected design-focused mode.
  • compare_images: Compares two to four images from URLs, local paths, or base64 data.
  • palette: Extracts colors, spacing, and typography as design-token information through image analysis.
  • hierarchy: Examines visual hierarchy and the likely eye-flow path through an interface.
  • components: Lists visible UI components and evaluates design-system maturity.

Optional analysis settings include temperature and maximum output tokens.

Limitations and notes

The server depends on access to Google Gemini or Vertex AI and requires the matching credentials before analysis can run. Vertex AI additionally depends on a Google Cloud Storage bucket. Image comparison is limited to a minimum of two and a maximum of four sources. Processing time can be substantial, so MCP client timeout settings may need adjustment.

Read the full README View source on GitHub

Reviews

No reviews yet — be the first to share how it worked for you.

Frequently Asked Questions about AI Vision MCP

tan-yong-sheng/ai-vision-mcp is an MCP server that connects MCP clients to Google Gemini or Vertex AI for multimodal analysis. Its main tools analyze images, compare two to four images, extract design tokens, assess visual hierarchy, and catalog UI components from interface imagery.

Install it by configuring your MCP client to run `npx ai-vision-mcp`. The README includes setup examples for Claude Desktop, Claude Code, Cursor, and Cline, along with the provider credentials required by Google AI Studio or Vertex AI.

Yes, it works with Cursor through a stdio MCP configuration. Add the server command and required environment variables to Cursor's global `~/.cursor/mcp.json` file or to a project-level `.cursor/mcp.json` file.

The required variables depend on the provider. Google AI Studio uses `IMAGE_PROVIDER`, `VIDEO_PROVIDER`, and `GEMINI_API_KEY`; Vertex AI uses those provider selectors plus service-account fields, a project ID, and `GCS_BUCKET_NAME`.

Related MCP servers

All in Multimedia Process All alternatives
Add a badge to your READMEShow it’s listed — live SVG, Markdown or HTML.

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:
Live Dynamic SVG PreviewAI Vision MCP AllMCPs Directory Badge
Markdown (GitHub README)
[![AllMCPs](https://allmcps.com/api/badge/tan-yong-sheng-ai-vision-mcp?style=directory)](https://allmcps.com/mcp/tan-yong-sheng-ai-vision-mcp)
HTML Embed
<a href="https://allmcps.com/mcp/tan-yong-sheng-ai-vision-mcp"><img src="https://allmcps.com/api/badge/tan-yong-sheng-ai-vision-mcp?style=directory" alt="AI Vision MCP on AllMCPs" /></a>