Skip to main content
Glama
sethbang

MCP Screenshot Server

by sethbang

범용 스크린샷 MCP

npm version MCP Registry License

AI 어시스턴트에게 스크린샷 기능을 제공하는 MCP (Model Context Protocol) 서버입니다. Puppeteer를 통한 웹 페이지 캡처와 기본 OS 도구를 사용한 크로스 플랫폼 시스템 스크린샷 기능을 모두 지원합니다.

기능

  • 웹 페이지 스크린샷 — 헤드리스 Chromium 브라우저를 사용하여 모든 공개 URL 캡처

  • 크로스 플랫폼 시스템 스크린샷 — 기본 OS 도구(macOS screencapture, Linux maim/scrot/gnome-screenshot 등, Windows PowerShell+.NET)를 사용하여 전체 화면, 창 또는 영역 캡처

  • 보안 우선 설계 — SSRF 방지, 경로 탐색 보호, DNS 리바인딩 방어, 명령 주입 방지 및 DoS 제한

  • MCP 네이티브 — Claude Desktop, Cursor 및 모든 MCP 호환 클라이언트와 직접 통합

Related MCP server: Chrome DevTools MCP

요구 사항

  • Node.js >= 18.0.0

  • Chromium은 첫 실행 시 Puppeteer에 의해 자동으로 다운로드됩니다.

take_system_screenshot을 위한 플랫폼별 요구 사항

플랫폼

필수 도구

참고

macOS

screencapture (내장)

추가 설치 불필요

Linux

다음 중 하나: maim, scrot, gnome-screenshot, spectacle, grim, 또는 import (ImageMagick)

전체 기능 지원을 위해 maim 또는 scrot 권장. 창 이름별 캡처를 위해서는 xdotool도 설치하세요.

Windows

powershell (내장)

.NET System.Drawing 사용 — 추가 설치 불필요

Linux 설치 예시

# 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

설치 후 다음 명령어로 설정을 확인할 수 있습니다:

npx universal-screenshot-mcp --doctor

이 명령은 호스트를 탐색하고 감지된 배포판에 맞춰 누락된 도구에 대한 복사/붙여넣기 가능한 설치 명령을 출력합니다.

빠른 시작

npm에서 설치

npm install -g universal-screenshot-mcp

또는 npx로 직접 실행:

npx universal-screenshot-mcp

소스에서 설치

git clone https://github.com/sethbang/mcp-screenshot-server.git
cd mcp-screenshot-server
npm install
npm run build

MCP 클라이언트 구성

MCP 클라이언트 구성에 서버를 추가하세요. Claude Desktop의 경우 ~/Library/Application Support/Claude/claude_desktop_config.json을 편집합니다:

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

소스에서 설치한 경우:

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

Claude Code의 경우 claude mcp add 명령으로 서버를 등록합니다:

# 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

소스에서 설치한 경우:

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

claude mcp list로 서버 등록을 확인하거나, 세션 내에서 /mcp를 사용하여 실시간 상태를 확인하세요.

Cursor 또는 기타 MCP 클라이언트의 경우 해당 문서에서 동일한 구성을 참조하세요.

도구

서버는 두 가지 MCP 도구를 노출합니다:

take_screenshot

헤드리스 Puppeteer 브라우저를 통해 웹 페이지(또는 특정 요소)를 캡처합니다.

매개변수

유형

필수

설명

url

string

✅

캡처할 URL (http/https만 가능)

width

number

—

뷰포트 너비 (1–3840)

height

number

—

뷰포트 높이 (1–2160)

fullPage

boolean

—

전체 스크롤 가능한 페이지 캡처

selector

string

—

특정 요소를 캡처하기 위한 CSS 선택자

waitForSelector

string

—

캡처 전 해당 선택자를 대기

waitForTimeout

number

—

밀리초 단위 지연 (0–30000)

outputPath

string

—

출력 파일 경로 (기본값: ~/Documents/screenshots)

예시 프롬프트:

1920x1080 크기로 https://example.com 스크린샷을 찍어줘

take_system_screenshot

기본 OS 도구를 사용하여 데스크톱, 특정 애플리케이션 창 또는 화면 영역을 캡처합니다. macOS, Linux, Windows에서 작동합니다.

매개변수

유형

필수

설명

mode

enum

✅

fullscreen, window, 또는 region

windowId

number

—

창 모드를 위한 창 ID

windowName

string

—

창 모드를 위한 앱 이름 (예: "Safari", "Firefox")

region

object

—

영역 모드를 위한 { x, y, width, height }

display

number

—

다중 모니터 설정을 위한 디스플레이 번호

includeCursor

boolean

—

캡처에 마우스 커서 포함

format

enum

—

png (기본값) 또는 jpg

delay

number

—

초 단위 캡처 지연 (0–10)

outputPath

string

—

출력 파일 경로 (기본값: ~/Documents/screenshots)

크로스 플랫폼 기능 지원

기능

macOS

Linux

Windows

전체 화면

✅

✅

✅

영역

✅

✅ (maim, scrot, grim, import)

✅

이름별 창

✅

⚠️ X11 + xdotool

⚠️ 최선 노력

ID별 창

✅

✅ X11 전용

⚠️ HWND

다중 디스플레이

✅

⚠️ 도구 의존적

✅

커서 포함

✅

⚠️ 도구 의존적

⚠️

지연

✅

✅

✅

예시 프롬프트:

Safari 창의 시스템 스크린샷을 찍어줘

구성

환경 변수

변수

기본값

설명

SCREENSHOT_OUTPUT_DIR

Documents/screenshots

~ 기준 기본 출력 디렉토리

ALLOW_LOCAL

false

localhost/127.x.x.x/[::1] 스크린샷을 허용하려면 true로 설정 (로컬 개발 서버에 유용)

출력 디렉토리

스크린샷은 기본적으로 ~/Documents/screenshots에 저장됩니다(SCREENSHOT_OUTPUT_DIR을 통해 구성 가능). 사용자 지정 출력 경로는 허용된 디렉토리 중 하나로 확인되어야 합니다:

디렉토리

설명

~/Documents/screenshots

기본 출력 위치 (구성 가능)

~/Desktop/Screenshots

원래 기본 위치

~/Downloads

사용자 다운로드 폴더

~/Documents

사용자 문서 폴더

/tmp

시스템 임시 디렉토리

보안

이 서버는 다중 보안 강화 계층을 구현합니다:

ID

위협

완화 조치

SEC-001

SSRF / DNS 리바인딩

차단된 IP 범위에 대해 URL 검증; --host-resolver-rules를 통한 IP 고정으로 요청 전 DNS 확인; 탐색 리디렉션 재검증

SEC-003

명령 주입

모든 하위 프로세스는 execFile 사용 (쉘 없음); 앱 이름은 SAFE_APP_NAME_PATTERN에 대해 검증

SEC-004

경로 탐색

fs.realpath() 심볼릭 링크 확인으로 출력 경로 검증; 허용된 디렉토리로 제한

SEC-005

서비스 거부

세마포어를 통해 동시 Puppeteer 인스턴스를 3개로 제한

자세한 내용은 docs/security.md를 참조하세요.

개발

스크립트

명령

설명

npm run build

TypeScript를 build/로 컴파일

npm run watch

파일 변경 시 재컴파일

npm test

단위 테스트 (빠름, 완전히 모의됨)

npm run test:integration

통합 테스트 (실제 DNS/파일시스템)

npm run test:e2e

E2E 테스트 (실제 Puppeteer/기본 도구)

npm run test:all

모든 테스트 계층 통합

npm run test:linux

Docker를 통한 Linux e2e (Docker 필요)

npm run test:watch

감시 모드에서 테스트 실행

npm run test:coverage

커버리지 보고서와 함께 테스트 실행

npm run lint

ESLint로 소스 린트

npm run inspector

디버깅을 위한 MCP Inspector 실행

프로젝트 구조

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)

테스트

테스트는 Vitest를 사용하여 세 계층으로 수행됩니다:

  • 단위 (npm test) — 전체 의존성 주입, 실제 I/O 없음. 빠른 피드백 루프.

  • 통합 (npm run test:integration) — 실제 DNS 확인, 임시 디렉토리가 있는 실제 파일시스템, 로컬 HTTP 서버에 대한 실제 Puppeteer.

  • E2E (npm run test:e2e) — 실제 기본 스크린샷 도구. macOS 테스트는 네이티브로 실행; Linux 테스트는 npm run test:linux를 통해 Docker에서 실행.

npm test                 # Unit tests (~300ms)
npm run test:linux       # Linux provider tests in Docker
npm run test:all         # Everything

MCP Inspector로 디버깅

npm run inspector

이 명령은 빌드된 서버에 연결된 MCP Inspector를 실행하여 도구를 대화형으로 호출할 수 있게 합니다.

라이선스

Apache-2.0 — Copyright 2026 Seth Bang

Available Tools

2 tools
take_screenshotB

Capture web page or element via headless browser. Saves to ~/Documents/screenshots by default (configurable via SCREENSHOT_OUTPUT_DIR env var).

ParametersJSON Schema
NameRequiredDescriptionDefault
urlYesURL to capture
widthNoViewport width
heightNoViewport height
fullPageNoCapture full page
selectorNoCSS selector for element
waitForSelectorNoWait for selector
waitForTimeoutNoDelay in ms
outputPathNoAbsolute path, or relative to home dir

TDQS

B3.4/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations, the description carries full burden but only mentions method and save location; it omits critical behavioral traits like destructiveness, permission needs, or return value.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two concise sentences: first states purpose, second details save behavior. Front-loaded and no wasted words.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness2/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Despite 8 parameters and no output schema, the description omits return value, error handling, and other essential context, leaving significant gaps.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema covers all 8 parameters with descriptions, so baseline is 3. The description adds the default save path and env var override, providing marginal extra context.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description uses specific verb 'capture' and resource 'web page or element' with method 'via headless browser', clearly distinguishing it from sibling 'take_system_screenshot' which captures system screens.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description implies usage for web screenshots but does not explicitly state when to use versus alternatives, nor does it mention prerequisites or exclusions.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

take_system_screenshotA

Capture desktop, window, or region screenshot. Cross-platform: macOS (screencapture), Linux (maim/scrot/gnome-screenshot/etc.), Windows (PowerShell+.NET). Saves to ~/Documents/screenshots by default (configurable via SCREENSHOT_OUTPUT_DIR env var). For window mode, provide windowName (app name like "Safari") or windowId.

ParametersJSON Schema
NameRequiredDescriptionDefault
modeYesfullscreen=entire screen, window=specific app (requires windowName or windowId), region=coordinates
windowIdNoWindow ID (for window mode)
windowNameNoApp name like "Safari", "Firefox" (for window mode)
regionNoRegion {x,y,width,height}
displayNoDisplay number
includeCursorNoInclude cursor
formatNoImage format (png or jpg)
delayNoDelay seconds
outputPathNoAbsolute path, or relative to home dir

TDQS

A3.6/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, so the description must carry the full burden. It discloses the default save location and cross-platform tool dependencies but does not mention return behavior (e.g., file path or binary), permission requirements, or failure modes.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is concise with 4 sentences, front-loading the main action. It effectively uses bullet-like information for cross-platform details and mode instructions, though it could be slightly more structured.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given 9 parameters including a nested object and no output schema, the description covers default directory and platform support but omits return value, error handling, and comparison with the sibling tool. It is adequate but not fully complete.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so the baseline is 3. The description adds minor value by specifying default output directory and that windowName is an app name, but the schema already describes all parameters adequately.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states 'Capture desktop, window, or region screenshot' with specific verb and resource. It distinguishes from the sibling tool 'take_screenshot' by specifying cross-platform support and modes.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description provides clear context for when to use each mode (fullscreen, window, region) and gives examples for window mode. However, it lacks guidance on when not to use this tool versus the sibling 'take_screenshot', missing explicit exclusion or alternative differentiation.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Tool Schema Changelog

Recent tool additions, removals, and schema changes observed during successful MCP inspections.

  1. 2 tool updatesv1.2.0
    • Changedtake_screenshot10 fields changed
      • addedInput schema / $schema
        Added value: +"http://json-schema.org/draft-07/schema#"
      • addedInput schema / additionalProperties
        Added value: +false
      • changedInput schema / properties / fullPage / description
        Previous value: -"Capture full scrollable page"New value: +"Capture full page"
      • changedInput schema / properties / height / description
        Previous value: -"Viewport height in pixels"New value: +"Viewport height"
      • changedInput schema / properties / outputPath / description
        Previous value: -"Custom output path (optional)"New value: +"Absolute path, or relative to home dir"
      • addedInput schema / properties / selector
        Added value: +{
        +  "description": "CSS selector for element",
        +  "type": "string"
        +}
      • changedInput schema / properties / url / description
        Previous value: -"URL to capture (can be http://, https://, or file:///)"New value: +"URL to capture"
      • addedInput schema / properties / waitForSelector
        Added value: +{
        +  "description": "Wait for selector",
        +  "type": "string"
        +}
      • addedInput schema / properties / waitForTimeout
        Added value: +{
        +  "description": "Delay in ms",
        +  "maximum": 30000,
        +  "minimum": 0,
        +  "type": "number"
        +}
      • changedInput schema / properties / width / description
        Previous value: -"Viewport width in pixels"New value: +"Viewport width"
    • Addedtake_system_screenshot
  2. 1 tool update
    • First observedtake_screenshot

TDQS

A3.7/5.0

Scored across 2 tools

Disambiguation5/5

The two tools are clearly distinct: one captures web pages/elements via headless browser, the other captures desktop/system screenshots. There is no overlap in functionality.

Naming Consistency5/5

Both tools follow a consistent verb_noun pattern with snake_case (take_screenshot, take_system_screenshot), using the same 'take_' prefix.

Tool Count3/5

Only 2 tools for a screenshot server is minimal but still covers the core use cases. More tools might be expected for management or configuration, but the count is not severely inadequate.

Completeness4/5

The tool set covers the primary screenshot domains (web and system). Minor gaps exist, such as listing or deleting screenshots, but core functionality is well-covered.

Maintenance

ActivitySlowing
ResponsivenessNo issues

Related MCP Connectors

Related MCP Servers

  • A
    license
    C
    quality
    D
    maintenance
    Enables taking screenshots of web pages with support for multiple devices (desktop, mobile, tablet), custom dimensions, full-page capture, and various image formats. Built with Playwright for reliable web page rendering and screenshot generation.
    1
    MIT
  • A
    license
    Not graded
    quality
    B
    maintenance
    Enables AI agents to capture any public URL as PNG, JPEG, or PDF via REST API or MCP tools, including screenshot capture, page description, and PDF rendering.
    10 npm
    MIT