mcpField
M
MCP Screenshot Server

MCP Screenshot Server

Local
github.com/sethbangBrowser Automation35Updated 8w ago

About MCP Screenshot Server

Universal Screenshot MCP is an MCP server that gives AI assistants web page capture through headless Chromium and system screenshots through native OS tools. It targets users who want screenshots from both browsers and the desktop. It stresses security hardening such as SSRF, path traversal and command injection protections.

Key features

  1. 01Web page capture with viewport, selector and wait options
  2. 02System capture of fullscreen, window or region
  3. 03Support for macOS, Linux and Windows
  4. 04SSRF and DNS rebinding protection
  5. 05--doctor command checks required tools

Use cases

  1. 01Letting an assistant inspect how a web page renders
  2. 02Capturing the desktop or an application window for bug reports
  3. 03Screenshotting local dev servers when ALLOW_LOCAL is enabled

MCP support

The server exposes the take_screenshot and take_system_screenshot tools to MCP clients such as Claude Desktop and Cursor.

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
"mcpServers": {
"screenshot-server": {
"command": "npx",
"args": [
"-y",
"universal-screenshot-mcp"
]
}
}
}
Run commandnpx -y universal-screenshot-mcp

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npmuniversal-screenshot-mcp1.4.0

Tools

2

Saved tool list · updated 2w ago

ParameterTypeRequiredDescription
urlstringYesURL to capture
widthnumberNoViewport width
heightnumberNoViewport height
fullPagebooleanNoCapture full page
selectorstringNoCSS selector for element
outputPathstringNoAbsolute path, or relative to home dir
waitForTimeoutnumberNoDelay in ms
waitForSelectorstringNoWait for selector

Details

From the project README

Universal Screenshot MCP

npm version MCP Registry License

An MCP (Model Context Protocol) server that provides AI assistants with screenshot capabilities — both web page capture via Puppeteer and cross-platform system screenshots using native OS tools.

Features

  • Web Page Screenshots — Capture any public URL using a headless Chromium browser
  • Cross-Platform System Screenshots — Fullscreen, window, or region capture using native OS tools (macOS screencapture, Linux maim/scrot/gnome-screenshot/etc., Windows PowerShell+.NET)
  • Security-First Design — SSRF prevention, path traversal protection, DNS rebinding defense, command injection prevention, and DoS limiting
  • MCP Native — Integrates directly with Claude Desktop, Cursor, and any MCP-compatible client

Requirements

  • Node.js >= 18.0.0
  • Chromium is downloaded automatically by Puppeteer on first run
Platform-Specific Requirements for take_system_screenshot
PlatformRequired ToolsNotes
macOSscreencapture (built-in)No additional installation needed
LinuxOne of: maim, scrot, gnome-screenshot, spectacle, grim, or import (ImageMagick)maim or scrot recommended for full feature support. For window-by-name capture, also install xdotool.
Windowspowershell (built-in)Uses .NET System.Drawing — no additional installation needed
Linux Installation Examples
# Ubuntu/Debian (recommended)
sudo apt install maim xdotool

# Fedora
sudo dnf install maim xdotool

# Arch Linux
sudo pacman -S maim xdotool

# Wayland (Sway, etc.)
sudo apt install grim

After installing, you can verify your setup with:

npx universal-screenshot-mcp --doctor

This probes the host and prints copy-pasteable install commands for any missing tools, tailored to your detected distro.

Quick Start

Install from npm
npm install -g universal-screenshot-mcp

Or run directly with npx:

npx universal-screenshot-mcp
Install from Source
git clone https://github.com/sethbang/mcp-screenshot-server.git
cd mcp-screenshot-server
npm install
npm run build
Configure Your MCP Client

Add the server to your MCP client configuration. For Claude Desktop, edit ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "screenshot-server": {
      "command": "npx",
      "args": ["-y", "universal-screenshot-mcp"]
    }
  }
}

Or if installed from source:

{
  "mcpServers": {
    "screenshot-server": {
      "command": "node",
      "args": ["/absolute/path/to/mcp-screenshot-server/build/index.js"]
    }
  }
}

For Claude Code, register the server with the claude mcp add command:

# Project scope (current directory only)
claude mcp add screenshot-server -- npx -y universal-screenshot-mcp

# User scope (available across all projects)
claude mcp add --scope user screenshot-server -- npx -y universal-screenshot-mcp

Or if installed from source:

claude mcp add screenshot-server -- node /absolute/path/to/mcp-screenshot-server/build/index.js

Verify the server registered with claude mcp list, or check live status from inside a session with /mcp.

For Cursor or other MCP clients, consult their documentation for the equivalent configuration.

Tools

The server exposes two MCP tools:

take_screenshot

Captures a web page (or a specific element) via a headless Puppeteer browser.

ParameterTypeRequiredDescription
urlstring✅URL to capture (http/https only)
widthnumber—Viewport width (1–3840)
heightnumber—Viewport height (1–2160)
fullPageboolean—Capture the full scrollable page
selectorstring—CSS selector to capture a specific element
waitForSelectorstring—Wait for this selector before capturing
waitForTimeoutnumber—Delay in milliseconds (0–30000)
outputPathstring—Output file path (default: ~/Documents/screenshots)

Example prompt:

Take a screenshot of https://example.com at 1920x1080

take_system_screenshot

Captures the desktop, a specific application window, or a screen region using native OS tools. Works on macOS, Linux, and Windows.

ParameterTypeRequiredDescription
modeenum✅fullscreen, window, or region
windowIdnumber—Window ID for window mode
windowNamestring—App name (e.g. "Safari", "Firefox") for window mode
regionobject—{ x, y, width, height } for region mode
displaynumber—Display number for multi-monitor setups
includeCursorboolean—Include the mouse cursor in the capture
formatenum—png (default) or jpg
delaynumber—Capture delay in seconds (0–10)
outputPathstring—Output file path (default: ~/Documents/screenshots)
Cross-Platform Feature Support
FeaturemacOSLinuxWindows
Fullscreen✅✅✅
Region✅✅ (maim, scrot, grim, import)✅
Window by name✅⚠️ X11 + xdotool⚠️ best-effort
Window by ID✅✅ X11 only⚠️ HWND
Multi-display✅⚠️ tool-dependent✅
Include cursor✅⚠️ tool-dependent⚠️
Delay✅✅✅

Example prompt:

Take a system screenshot of the Safari window

Configuration

Environment Variables
VariableDefaultDescription
SCREENSHOT_OUTPUT_DIRDocuments/screenshotsDefault output directory relative to ~
ALLOW_LOCALfalseSet to true to allow screenshotting localhost/127.x.x.x/[::1] (useful for local dev servers)
Output Directories

Screenshots are saved to ~/Documents/screenshots by default (configurable via SCREENSHOT_OUTPUT_DIR). Custom output paths must resolve to one of these allowed directories:

DirectoryDescription
~/Documents/screenshotsDefault output location (configurable)
~/Desktop/ScreenshotsOriginal default location
~/DownloadsUser downloads folder
~/DocumentsUser documents folder
/tmpSystem temp directory

Security

This server implements multiple layers of security hardening:

IDThreatMitigation
SEC-001SSRF / DNS rebindingURLs validated against blocked IP ranges; DNS resolved pre-request with IP pinning via --host-resolver-rules; navigation redirects re-validated
SEC-003Command injectionAll subprocesses use execFile (no shell); app names validated against SAFE_APP_NAME_PATTERN
SEC-004Path traversalOutput paths validated with fs.realpath() symlink resolution; restricted to allowed directories
SEC-005Denial of serviceConcurrent Puppeteer instances limited to 3 via semaphore

For full details, see docs/security.md.

Development

Scripts
CommandDescription
npm run buildCompile TypeScript to build/
npm run watchRecompile on file changes
npm testUnit tests (fast, fully mocked)
npm run test:integrationIntegration tests (real DNS/filesystem)
npm run test:e2eE2E tests (real Puppeteer/native tools)
npm run test:allAll test tiers together
npm run test:linuxLinux e2e via Docker (requires Docker)
npm run test:watchRun tests in watch mode
npm run test:coverageRun tests with coverage report
npm run lintLint source with ESLint
npm run inspectorLaunch MCP Inspector for debugging
Project Structure
src/
├── index.ts                 # Entry point — stdio transport
├── server.ts                # MCP server factory
├── config/
│   ├── index.ts             # Static constants (limits, allowed dirs)
│   └── runtime.ts           # Singleton semaphore, default directory
├── tools/
│   ├── take-screenshot.ts   # Web page capture tool
│   └── take-system-screenshot.ts  # macOS system capture tool
├── types/
│   └── index.ts             # Shared TypeScript interfaces
├── utils/
│   ├── helpers.ts           # Response builders, file utilities
│   ├── screenshot-provider.ts # Cross-platform provider interface + factory
│   ├── macos-provider.ts    # macOS: screencapture wrapper
│   ├── linux-provider.ts    # Linux: maim/scrot/gnome-screenshot/etc.
│   ├── windows-provider.ts  # Windows: PowerShell + .NET System.Drawing
│   ├── macos.ts             # Window ID lookup via CoreGraphics
│   └── semaphore.ts         # Async concurrency limiter
└── validators/
    ├── path.ts              # Output path validation (SEC-004)
    └── url.ts               # URL/SSRF validation (SEC-001)
Testing

Tests use Vitest in three tiers:

  • Unit (npm test) — Full dependency injection, no real I/O. Fast feedback loop.
  • Integration (npm run test:integration) — Real DNS resolution, real filesystem with temp directories, real Puppeteer against a local HTTP server.
  • E2E (npm run test:e2e) — Real native screenshot tools. macOS tests run natively; Linux tests run in Docker via npm run test:linux.
npm test                 # Unit tests (~300ms)
npm run test:linux       # Linux provider tests in Docker
npm run test:all         # Everything
Debugging with MCP Inspector
npm run inspector

This launches the MCP Inspector connected to your built server, allowing you to invoke tools interactively.

License

Apache-2.0 — Copyright 2026 Seth Bang

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.