Skip to main content
Glama
deenesjakoruzh
reeinharddd

snapmcp

by reeinharddd
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Local

실제 터미널 색상, Shiki로 하이라이트된 코드, 시각적 diff, PDF 및 GIF — 하나의 MCP 서버, 13개의 도구, 무거운 의존성 제로. SSRF 보호는 기본적으로 켜져 있습니다. 브라우저를 조종하는 것만이 아니라 문서를 작성하는 에이전트를 위해 만들어졌습니다.

빠른 시작

세 단계, 2분 이내:

1. 설치

npm install -g snapmcp
# or run without installing: npx -y snapmcp

2. Claude Code에 추가 (~/.claude/claude.json)

{
  "mcpServers": {
    "snapmcp": {
      "command": "npx",
      "args": ["-y", "snapmcp"],
      "env": {
        "SNAPMCP_DIR": "./captures",
        "SNAPMCP_THEME": "nord"
      }
    }
  }
}

3. 캡처

에이전트에게 자연어로 요청하세요:

"git log --oneline -5의 터미널 스크린샷과 src/index.ts의 구문 하이라이트 PNG를 캡처해 줘."

에이전트가 capture_terminal과 capture_file을 호출합니다 — 이미지는 ./captures/에 저장되며, 실제 터미널 테마와 선택한 구문 테마가 적용됩니다.

OpenCode (opencode.json):

{
  "mcpServers": {
    "snapmcp": {
      "command": "npx",
      "args": ["-y", "snapmcp"],
      "env": {
        "SNAPMCP_DIR": "./captures",
        "SNAPMCP_FORMAT": "jpeg",
        "SNAPMCP_QUALITY": "95"
      }
    }
  }
}

VS Code / Cline / Roo-Cline (settings.json → cline.mcpServers):

{
  "mcpServers": {
    "snapmcp": {
      "command": "npx",
      "args": ["-y", "snapmcp"],
      "env": {
        "SNAPMCP_DIR": "./captures",
        "SNAPMCP_FORMAT": "jpeg"
      }
    }
  }
}

Docker:

docker run -i --rm \
  -e SNAPMCP_DIR=/captures \
  -e SNAPMCP_THEME=nord \
  -v /path/to/output:/captures \
  ghcr.io/reeinharddd/snapmcp

Related MCP server: @tscafejr/mcp

실제 모습

snapmcp로 생성된 실제 스크린샷:

캡처

미리보기

터미널 (실제 감지된 색상)

코드 (Shiki 구문)

Diff (녹색/빨간색)

마크다운 렌더링

snapmcp vs Playwright MCP

각자 다른 작업을 위한 다른 도구입니다. Playwright MCP는 토큰 효율적인 접근성 스냅샷을 통해 브라우저를 조종하고, snapmcp는 사람이 읽을 수 있도록 픽셀을 충실히 반영한 이미지를 렌더링합니다. 에이전트가 클릭해야 한다면 Playwright를 사용하세요. 보여줘야 한다면 snapmcp를 사용하세요.

사용 사례

snapmcp

Playwright MCP

실제 색상의 터미널 캡처

✅ Kitty, Gnome, Alacritty, WezTerm 테마 자동 감지

❌ 터미널 지원 없음

코드 → 구문 하이라이트 이미지

✅ Shiki, 50개 이상 언어, 27개 테마

❌ 그 목적이 아님

Git diff → 시각적 빨강/초록 이미지

✅ capture_diff

❌

URL → PDF 문서

✅ capture_pdf

❌

캡처에서 애니메이션 GIF 생성

✅ capture_gif (제로 의존성 gifenc)

❌

마크다운 → 스타일링된 문서

✅ capture_markdown, capture_to_document

❌

브라우저 페이지 스크린샷

✅ capture_browser (전체 페이지 또는 뷰포트)

✅

브라우저 자동화 (클릭, 입력, 이동)

❌ 스크린샷만 가능

✅ 접근성 트리 기반, 토큰 효율적 — 이 작업에 적합한 도구

대부분의 문서화 파이프라인은 둘을 함께 사용합니다: 상호작용은 Playwright MCP, 문서화는 snapmcp.

도구

도구

설명

capture_terminal

구문 색상 프롬프트가 있는 터미널 출력 (실제 터미널 테마 자동 감지)

capture_code

Shiki를 통한 구문 하이라이트 코드 (50개 이상 언어, 27개 테마)

capture_browser

전체 페이지 또는 뷰포트 스크린샷 (가능한 경우 시스템 Chrome 프로필 사용)

capture_file

파일 → 언어 자동 감지 → 하이라이트 스크린샷

capture_markdown

스타일링된 문서로 렌더링된 마크다운

capture_html

이미지로 렌더링된 임의의 HTML 스니펫

capture_diff

녹색 추가 / 빨간색 삭제가 있는 Git diff

capture_pdf

URL → PDF 문서

capture_batch

한 번의 호출로 여러 항목 일괄 캡처

capture_gif

여러 스크린샷에서 만든 애니메이션 GIF

capture_sequence

나란히 보여주는 애니메이션 시퀀스

capture_to_document

여러 섹션 마크다운 문서 렌더링

snapmcp-hint

MCP 클라이언트를 위한 서버 기능 힌트

사용 사례

자동화된 문서화 — 에이전트가 설정 가이드를 작성하고 실제 캡처를 삽입합니다: 설치 명령의 터미널 출력(실제 테마 적용), 구문 하이라이트된 설정 파일, 마이그레이션의 diff. 하나의 프롬프트, 세 번의 capture_* 호출, 마크다운 옆에 저장된 이미지.

시각적 QA — UI 변경 후 에이전트가 capture_browser로 영향을 받은 페이지를 캡처하고, capture_batch로 전후를 일괄 캡처한 다음, capture_gif로 애니메이션 비교를 만들어 PR 설명에 넣습니다.

터미널 가이드 — 스크린샷이 독자가 실제로 보게 될 화면과 일치해야 하는 CLI 튜토리얼: capture_terminal은 일반적인 어두운 사각형 대신 실제 프롬프트 색상을 재현합니다.

보안

SSRF 보호는 기본적으로 켜져 있습니다 — 별도로 설정할 필요가 없습니다.

기능

설명

SSRF 보호

기본적으로 켜짐 (SNAPMCP_SSRF_PROTECTION=false로 비활성화). IP 리터럴(v4 + v6), localhost 변형, 그리고 사설 대역으로 해석되는 DNS 이름을 차단합니다 (127.0.0.0/8, 10.0.0.0/8, 172.16.0.0/12, 192.168.0.0/16, fc00::/7, fe80::/10 등); 모든 페이지 요청(리다이렉트 포함)은 다시 검사됩니다

파일 허용 목록

SNAPMCP_ALLOWED_PATHS는 설정되지 않으면 기본적으로 모두 거부; 명시적으로 허용된 경로만 캡처할 수 있습니다

경로 탐색 방지

../ 이스케이프, 심볼릭 링크 탐색(realpath 통해), 널 바이트 주입을 방지합니다

입력 제한

터미널 1000줄; 코드/마크다운/HTML 200KB; diff 500KB; 파일 읽기 5MB; 최대 GIF 프레임 60; 최대 GIF 캔버스 8192×8192

감사 로그

타임스탬프가 있는 이벤트를 기록하는 선택적 구조화된 JSON 로그 파일

Chromium 샌드박스

시작 시 샌드박스 사용 가능 여부 확인

구성

MCP 서버용 환경 변수:

Variable

기본값

설명

SNAPMCP_DIR

./captures

캡처 출력 디렉터리

SNAPMCP_THEME

자동 감지

구문 테마 (27개 내장 테마 + 자동 감지 터미널)

SNAPMCP_FORMAT

png

출력 형식 (png, jpeg)

SNAPMCP_QUALITY

90

JPEG 품질 (1-100)

SNAPMCP_PADDING

32

콘텐츠 패딩(픽셀)

SNAPMCP_SHADOW

none

드롭 섀도우 (none, soft, medium, strong; 별칭 sm/md/lg)

SNAPMCP_WINDOW_CHROME

false

macOS 스타일 제목 표시줄 프레임

SNAPMCP_BORDER_RADIUS

0

창 모서리 반경

SNAPMCP_BADGE

false

바닥글 배지

SNAPMCP_LOG_FILE

—

감사 로그 파일 경로

SNAPMCP_CHROME_EXECUTABLE

—

Chrome/Chromium 바이너리 경로

SNAPMCP_CHROME_CHANNEL

—

Chrome 채널 (stable, beta, dev, canary)

SNAPMCP_CHROME_PROFILE

—

Chrome 프로필 디렉터리 이름

SNAPMCP_ALLOWED_PATHS

(모두 거부)

capture_file에 허용되는 파일 경로(쉼표 또는 세미콜론으로 구분)

27개 내장 Shiki 테마: dracula, one-dark-pro, nord, tokyo-night, catppuccin-mocha, catppuccin-latte, ayu-dark, ayu-light, vitesse-dark, vitesse-light, min-dark, min-light, poimandres, rose-pine, rose-pine-moon, rose-pine-dawn, slack-dark, slack-ochin, snazzy-light, github-dark-dimmed, github-light, one-light, solarized-light, solarized-dark, material-theme, material-theme-lighter, material-theme-ocean

CLI

SnapMCP는 MCP 서버 외에도 완전한 CLI를 제공합니다:

snapmcp        — Start the MCP server
snapmcp init   — Interactive setup wizard (detects Chrome, terminal theme, output dir)
snapmcp doctor — Health check: 7 checks across Node, Chromium, paths, env
snapmcp test   — Generate test captures (terminal + code) to verify the setup

문서

페이지

내용

Getting Started

설치, 빠른 시작, MCP 클라이언트 설정

Tools Reference

13개 도구와 매개변수 및 예시

Configuration

모든 SNAPMCP_* 환경 변수, 테마, 기본값

CLI Reference

Init, doctor, test 명령

Guides

터미널 캡처, 브라우저 캡처, GIF 애니메이션

ARCHITECTURE.md

모듈 맵, 데이터 흐름, 보안 아키텍처

CONTRIBUTING.md

개발 워크플로우, 테스트 가이드라인, PR 체크리스트

개발

git clone https://github.com/reeinharddd/snapmcp
cd snapmcp
bun install
bun run build    # tsc → dist/
bun test         # 317 tests

요구 사항: Node.js ≥ 20 또는 Bun ≥ 1.2. CI는 GitHub Actions를 통해 ubuntu / macOS / windows에서 실행됩니다.

라이선스

MIT — LICENSE 참고.

This server cannot be installed

A
license - permissive license
Not graded
quality - not tested
A
maintenance

How are these scores calculated?

Maintenance

–Maintainers
–Response time
2wRelease cycle
5Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Servers

  • ws-mcp

    rm-rf-prod
    A
    license
    A
    quality
    A
    maintenance
    A self-hosted MCP server that fetches live documentation and performs code audits using real-time authoritative references to prevent AI hallucinations. It provides tools for searching documentation across 330+ libraries and scanning local source code for security, performance, and accessibility issues.
    14
    601
    5
    Elastic 2.0

  • aifmt

    ericchansen
    A
    license
    Not graded
    quality
    D
    maintenance
    An MCP server that fixes, validates, and generates visual text content for AI coding assistants.
    MIT

View all related MCP servers

Related MCP Connectors

  • doc2mcp

    MCP server for doc2mcp documentation, generated by doc2mcp.

  • neverinfamous-memory-journal-mcp

    A MCP server built for developers enabling Git based project management with project and personal…

  • mcp

    Augments MCP Server - A comprehensive framework documentation provider for Claude Code

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/reeinharddd/snapmcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server