Image Viewer MCP

A Model Context Protocol (MCP) server for displaying images from your local filesystem directly in Claude conversations.

Features

• Display Images: View actual images (not just OCR) directly in Claude
• Image Information: Get detailed metadata about image files
• Directory Listing: Find and list all images in a directory
• Multiple Formats: Supports JPG, PNG, GIF, BMP, WebP, and SVG files
• Path Resolution: Supports ~ for home directory and relative paths

Installation

1. Build the project:

npm install
npm run build

2. Add to your Claude MCP configuration (usually in ~/Library/Application Support/Claude/claude_desktop_config.json):

{
  "mcpServers": {
    "image-viewer": {
      "command": "node",
      "args": ["/Users/ian/image-viewer-mcp/dist/index.js"]
    }
  }
}

Available Tools

display-image

Display an image from the filesystem. Returns the image as base64 data that Claude can render.

• imagePath (string): Path to the image file (supports ~ for home directory)

list-images

Find and list image files in a directory.

• searchPath (string): Directory path to search for images
• recursive (boolean, optional): Whether to search subdirectories recursively

image-info

Get detailed information about an image file without loading the full image data.

• imagePath (string): Path to the image file

Usage Examples

Display the headshot image:
- Tool: display-image
- imagePath: ~/Pictures/Headshot_Headphones.jpg

List all images in Pictures folder:
- Tool: list-images  
- searchPath: ~/Pictures
- recursive: false

Get info about an image:
- Tool: image-info
- imagePath: ~/Pictures/Headshot_Headphones.jpg

Troubleshooting

• Ensure the image file exists and is readable
• Check that the file extension is supported
• Verify the path is correct (use absolute paths for reliability)
• Large images may take longer to load due to base64 encoding

Supported Image Types

• JPEG (.jpg, .jpeg)
• PNG (.png)
• GIF (.gif)
• BMP (.bmp)
• WebP (.webp)
• SVG (.svg)