mcpField
S
screenshotrun-mcp

screenshotrun-mcp

Local
github.com/webmoxBrowser Automation0Updated 6d ago

About screenshotrun-mcp

screenshotrun-mcp lets AI agents capture public webpages through ScreenshotRun and inspect the returned images. It supports page, device, and rendering options, plus API usage checks.

Key features

  1. 01PNG, JPEG, WebP, and PDF capture
  2. 02Desktop, mobile, and tablet emulation
  3. 03Full-page and dark-mode rendering
  4. 04Ad and cookie banner blocking
  5. 05CSS and JavaScript injection
  6. 06API quota checks

Use cases

  1. 01Review a webpage visually
  2. 02Compare mobile and desktop layouts
  3. 03Capture a full page in dark mode
  4. 04Check remaining screenshot quota

MCP support

The MCP server exposes screenshot capture and API usage tools to MCP clients. Captures are returned as base64-encoded images for an agent to analyze.

Configuration

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

mcp.json · Universal config
{
"mcpServers": {
"webmox-screenshotrun": {
"command": "npx",
"args": [
"-y",
"screenshotrun-mcp"
],
"env": {
"SCREENSHOTRUN_API_KEY": "<SCREENSHOTRUN_API_KEY>"
}
}
}
}
Run commandnpx -y screenshotrun-mcp
Environment variables to set
SCREENSHOTRUN_API_KEYSecretYour ScreenshotRun API key. Get one free at screenshotrun.com (200 screenshots/month).

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
npmscreenshotrun-mcp1.0.3

Tools

2

Saved tool list · updated 5d ago

ParameterTypeRequiredDescription
jsstringNoCustom JavaScript to execute before capture
cssstringNoCustom CSS to inject into the page
urlstringYesURL of the page to screenshot (must start with http:// or https://)
delayintegerNoDelay in seconds after page load before capturing
widthintegerNoViewport width in pixels
deviceenumNoDevice preset (affects viewport and user agent)desktop | mobile | tablet
formatenumNoOutput image formatpng | jpeg | webp | pdf
heightintegerNoViewport height in pixels
retinabooleanNoCapture at 2x resolution (retina)
qualityintegerNoImage quality for JPEG/WebP (1-100)
selectorstringNoCSS selector to capture a specific element instead of the full viewport
block_adsbooleanNoBlock advertisements during capture
dark_modebooleanNoEnable dark mode (prefers-color-scheme: dark)
full_pagebooleanNoCapture the entire scrollable page
scroll_tostringNoCSS selector of an element to scroll into view before capture
block_cookiesbooleanNoBlock cookie consent dialogs
click_selectorstringNoCSS selector of an element to click before capture
hide_selectorsarrayNoCSS selectors of elements to hide before capture

Details

From the project README

screenshotrun-mcp

npm version License: MIT

Give your AI agent the ability to see any webpage. MCP server for ScreenshotRun Screenshot API.

Features

  • Capture screenshots of any public webpage as PNG, JPEG, WebP, or PDF
  • Device emulation — desktop, mobile, and tablet viewports
  • Dark mode rendering with prefers-color-scheme: dark
  • Full-page capture with automatic scrolling
  • Block ads and cookie consent banners
  • Inject custom CSS/JavaScript before capture
  • Target specific elements with CSS selectors
  • Retina (2x) resolution support
  • Monitor your API usage and remaining quota

Quick Start

1. Get your API key

Sign up for a free API key at screenshotrun.com.

2. Configure your AI client
Claude Desktop

Add to your Claude Desktop config (~/Library/Application Support/Claude/claude_desktop_config.json on macOS, %APPDATA%\Claude\claude_desktop_config.json on Windows):

{
  "mcpServers": {
    "screenshotrun": {
      "command": "npx",
      "args": ["-y", "screenshotrun-mcp"],
      "env": {
        "SCREENSHOTRUN_API_KEY": "sr_live_your_key_here"
      }
    }
  }
}
Claude Code
claude mcp add screenshotrun \
  npx -y screenshotrun-mcp \
  -e SCREENSHOTRUN_API_KEY=sr_live_your_key_here
Cursor

Add to .cursor/mcp.json in your project:

{
  "mcpServers": {
    "screenshotrun": {
      "command": "npx",
      "args": ["-y", "screenshotrun-mcp"],
      "env": {
        "SCREENSHOTRUN_API_KEY": "sr_live_your_key_here"
      }
    }
  }
}
Windsurf

Add to your Windsurf MCP configuration with the same npx -y screenshotrun-mcp command and set the SCREENSHOTRUN_API_KEY environment variable.

Available Tools

take_screenshot

Capture a screenshot of any webpage. Returns the image as base64-encoded data that AI agents can analyze and describe.

ParameterTypeDefaultDescription
urlstringrequiredURL to screenshot (must include http:// or https://)
formatpng | jpeg | webp | pdfpngOutput image format
widthnumber1280Viewport width in pixels (320–3840)
heightnumber800Viewport height in pixels (200–2160)
full_pagebooleanfalseCapture the entire scrollable page
qualitynumber80Image quality for JPEG/WebP (1–100)
devicedesktop | mobile | tablet—Device preset (overrides width/height with device defaults)
dark_modebooleanfalseEnable dark mode rendering
block_adsbooleanfalseBlock advertisements during capture
block_cookiesbooleantrueBlock cookie consent dialogs
delaynumber0Delay in seconds after page load before capturing (0–10)
retinabooleanfalseCapture at 2x resolution
cssstring—Custom CSS to inject into the page (max 10KB)
jsstring—Custom JavaScript to execute before capture (max 10KB)
selectorstring—CSS selector to capture a specific element
hide_selectorsstring[]—CSS selectors of elements to hide before capture
click_selectorstring—CSS selector of element to click before capture
scroll_tostring—CSS selector of element to scroll into view
check_usage

Check your ScreenshotRun API usage for the current billing period. Returns screenshots used, remaining quota, usage percentage, and days remaining.

No parameters required.

Example Prompts

  • "Take a screenshot of screenshotrun.com"
  • "Screenshot snapshotarchive.com in dark mode on mobile"
  • "Capture full-page screenshot of my website and describe what you see"
  • "Take a retina screenshot of screenshotrun.com in JPEG format"
  • "Screenshot snapshotarchive.com on tablet with ad blocking"
  • "Take a screenshot of my site with the cookie banner hidden using hide_selectors"
  • "Check my ScreenshotRun API usage"

How It Works

  1. Your AI agent receives a user request involving a webpage screenshot
  2. The agent calls the take_screenshot tool with the URL and options
  3. The MCP server sends the request to the ScreenshotRun API
  4. The API renders the page in a real browser and returns the screenshot
  5. The image is returned to the AI agent as base64, which it can analyze and describe

Requirements

Other Projects by ScreenshotRun

  • SnapshotArchive — Automated website monitoring with visual diff detection
  • WatchCron — Cron job & heartbeat monitoring for developers

License

MIT

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.