MCP.so
Sign In

Screenshotmcp MCP Server

@upnorthmedia

Basic information

Category

Other

Transports

stdio

Author

upnorthmedia

Submitted by

Up North Media

About Screenshotmcp MCP Server

A Model Context Protocol MCP server for capturing website screenshots with full page, element, and device size features.

#screenshots#ux-design#website-screenshot

Screenshotmcp MCP Server config

Add this server to your MCP-compatible client using the configuration below.

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

Screenshotmcp MCP Server tools

Tool list not available yet

This listing does not currently have a tool list to display. This does not mean the server has no tools; check its documentation for supported capabilities.

We auto-extract tools from the README. The maintainer can list them under a ## Tools heading to populate this section.

Overview

What is Screenshotmcp?

Screenshotmcp is an MCP server that captures screenshots of webpages using Puppeteer. It integrates with Claude Code CLI/Desktop, Cursor, and other MCP-compatible tools, allowing developers to automate screenshots through natural language commands.

How to use Screenshotmcp?

Install by cloning the repository, running npm install, then npm start. Configure Claude Code by adding the server to ~/.config/claude/mcp_servers.json or using claude mcp add. In Cursor, add it under Settings > MCP Servers. Once connected, issue commands like "Take a screenshot of https://example.com" or "Capture just the navigation bar from https://example.com".

Key features of Screenshotmcp

  • Full-page screenshots with custom viewports and device presets
  • Capture specific elements using CSS selectors
  • Wait for selectors, functions, timeouts, or network idle
  • Configurable via environment variables (.env file)
  • URL validation, rate limiting, and sandboxed browser execution
  • Three built-in device presets: mobile, tablet, desktop

Use cases of Screenshotmcp

  • Automate visual regression testing for web pages
  • Document UI states for bug reports or onboarding guides
  • Capture responsive views across mobile, tablet, and desktop
  • Integrate screenshot generation into CI/CD workflows
  • Debug specific elements by isolating them in a screenshot

Frequently asked questions

1

What are the system requirements?

Node.js 18+, Chrome/Chromium (installed automatically via Puppeteer), minimum 2GB RAM, and 500MB disk space.

2

How do I configure Screenshotmcp?

Set environment variables in the `.env` file, such as `BROWSER_HEADLESS`, `MAX_CONCURRENT_SCREENSHOTS`, and `DEFAULT_VIEWPORT_WIDTH`. Rename `.env.example` to `.env` to get started.

3

Can I take a mobile screenshot?

Yes, use the viewport preset `"mobile"` in the `capture_screenshot` tool, or specify custom `width`, `height`, and `deviceScaleFactor`.

4

What security measures are included?

Screenshotmcp validates URLs (HTTP/HTTPS only), sanitizes CSS selectors, enforces per‑window rate limiting, and runs the browser in a sandboxed environment.

Comments

More Other MCP servers