MCP SERVER

Screenshot Tool for AI Coding Agents

FrameSnap MCP server lets Claude Code, Cursor, Windsurf, and any MCP-compatible AI tool take screenshots natively. Your agent says "screenshot localhost:3000" and gets back an image it can see and reason about.

What is Model Context Protocol?

MCP (Model Context Protocol) is an open standard that lets AI coding agents connect to external tools and data sources. Think of it as USB for AI agents — a common plug that lets any MCP-compatible tool work with any MCP-compatible agent.

Instead of hard-coding support for every AI tool, developers build one MCP server and it works everywhere: Claude Code, Cursor, Windsurf, GitHub Copilot, and any other platform that implements the protocol. The spec is open source and the ecosystem is growing fast.

Why it matters for screenshots:

Before MCP, adding screenshot capability to an AI agent meant writing custom integration code for each tool. With MCP, you install one server and your agent immediately gains the ability to capture and analyze screenshots — without the developer writing any per-platform code.

How It Works

Install

Add the MCP server to your AI tool with one command. No dependencies to manage.

Ask

Tell your agent to take a screenshot. It calls the framesnap_screenshot tool automatically.

See

The agent receives the screenshot inline and can analyze it visually to verify UI changes or debug issues.

Setup

Choose your AI tool below. Setup takes under a minute.

Terminal

claude mcp add framesnap -e FRAMESNAP_API_KEY=fs_your_key -- npx -y @framesnap/mcp-server

That's it. Restart Claude Code and the framesnap_screenshot tool is available.

Add to your .cursor/mcp.json:

{
  "mcpServers": {
    "framesnap": {
      "command": "npx",
      "args": ["-y", "@framesnap/mcp-server"],
      "env": {
        "FRAMESNAP_API_KEY": "fs_your_key"
      }
    }
  }
}

Add this to your MCP client configuration:

{
  "mcpServers": {
    "framesnap": {
      "command": "npx",
      "args": ["-y", "@framesnap/mcp-server"],
      "env": {
        "FRAMESNAP_API_KEY": "fs_your_key"
      }
    }
  }
}

Works with any tool that supports the Model Context Protocol.

Available Tools

`framesnap_screenshot`

Take a screenshot of any URL. Returns the image inline for visual analysis.

Parameter	Description
url	URL to screenshot (required)
width, height	Viewport dimensions (default 1280x800)
full_page	Capture entire scrollable page
dark_mode	Use dark color scheme
save_path	File path to save screenshot to disk
delay	Wait ms before capture (0-5000)
block_ads	Block ad networks and trackers

Example Prompts

Once the MCP server is configured, just ask your agent naturally:

"Take a screenshot of localhost:3000 and check if the header looks right"

"Screenshot https://mysite.com in dark mode, full page"

"Take a screenshot of the signup page and save it to ./screenshots/signup.png"

"Screenshot this page at mobile width (390px) to check responsiveness"

Get Started Free

100 free screenshots per month. No credit card required.

Get API Key API Docs