Skip to main content
Glama
deenesjakoruzh
reeinharddd

snapmcp

by reeinharddd
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Local

実際のターミナル色、Shikiでハイライトされたコード、視覚的な差分、PDF、GIF — 1つのMCPサーバーに13のツール、重い依存関係はゼロ。SSRF保護はデフォルトで有効。ブラウザを操作するだけでなく、ドキュメントを書くエージェントのために作られています。

クイックスタート

3つのステップ、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シンタックス）

差分（緑/赤）

Markdownレンダリング

snapmcp vs Playwright MCP：どちらを使うべきか

それぞれ異なる用途に適したツールです。Playwright MCPはトークン効率の高いアクセシビリティスナップショットを通じてブラウザを操作します。snapmcpは人間が読むためのピクセル忠実な画像をレンダリングします。エージェントがクリックする必要があるならPlaywrightを、見せる必要があるならsnapmcpを使いましょう。

ユースケース

snapmcp

Playwright MCP

実色でのターミナルキャプチャ

✅ Kitty、Gnome、Alacritty、WezTermのテーマを自動検出

❌ ターミナル非対応

コード → シンタックスハイライト画像

✅ Shiki、50以上の言語、27テーマ

❌ その目的ではない

Git差分 → 視覚的な赤/緑画像

✅ capture_diff

❌

URL → PDFドキュメント

✅ capture_pdf

❌

キャプチャからのアニメーションGIF

✅ capture_gif（依存ゼロのgifenc）

❌

Markdown → スタイル付きドキュメント

✅ capture_markdown、capture_to_document

❌

ブラウザページのスクリーンショット

✅ capture_browser（フルページまたはビューポート）

✅

ブラウザの自動操作（クリック、入力、移動）

❌ スクリーンショットのみ

✅ アクセシビリティツリー駆動、トークン効率が高い — この用途に最適のツール

ほとんどのドキュメントパイプラインでは、この2つを組み合わせて使います：操作にはPlaywright MCP、記録にはsnapmcp。

ツール

ツール

説明

capture_terminal

シンタックスカラーのプロンプト付きターミナル出力（実際のターミナルテーマを自動検出）

capture_code

Shikiによるシンタックスハイライト済みコード（50以上の言語、27テーマ）

capture_browser

フルページまたはビューポートのスクリーンショット（利用可能な場合はシステムのChromeプロファイルを使用）

capture_file

ファイル → 言語を自動検出 → ハイライト付きスクリーンショット

capture_markdown

レンダリングされたMarkdownをスタイル付きドキュメントとして出力

capture_html

任意のHTMLスニペットを画像としてレンダリング

capture_diff

緑の追加/赤の削除で表示するGit差分

capture_pdf

URL → PDFドキュメント

capture_batch

1回の呼び出しで複数項目を一括キャプチャ

capture_gif

複数のスクリーンショットからアニメーションGIFを生成

capture_sequence

横並びのアニメーションシーケンス

capture_to_document

複数セクションのMarkdownドキュメントをレンダリング

snapmcp-hint

MCPクライアント向けのサーバー機能ヒント

ユースケース

ドキュメント自動生成 — エージェントがセットアップガイドを作成し、実際のキャプチャを埋め込みます：インストールコマンドのターミナル出力（実際のテーマ適用済み）、シンタックスハイライトされた設定ファイル、マイグレーションの差分。1つのプロンプトで3回のcapture_*呼び出し、画像はマークダウンの隣に保存されます。

ビジュアルQA — UI変更後、エージェントがcapture_browserで影響を受けたページをキャプチャし、capture_batchで変更前/変更後をまとめて取得し、capture_gifでPR説明用のアニメーション比較を作成します。

ターミナルガイド — スクリーンショットが読者の実際の見た目と一致する必要があるCLIチュートリアル：capture_terminalは一般的な暗い四角形ではなく、実際のプロンプトの色を再現します。

セキュリティ

SSRF保護はデフォルトで有効です — オプトインは不要です。

機能

説明

SSRF保護

デフォルトで有効（SNAPMCP_SSRF_PROTECTION=falseで無効化）。IPリテラル（v4 + v6）、localhostのバリアント、プライベートレンジ（127.0.0.0/8、10.0.0.0/8、172.16.0.0/12、192.168.0.0/16、fc00::/7、fe80::/10など）に解決されるDNS名をブロック。すべてのページリクエスト（リダイレクトを含む）が再チェックされる

ファイル許可リスト

SNAPMCP_ALLOWED_PATHSは未設定時はデフォルトで全て拒否。明示的に許可されたパスのみキャプチャ可能

パストラバーサル

../によるエスケープ、シンボリックリンク経由のトラバーサル（realpath経由）、ヌルバイトインジェクションを防止

入力制限

ターミナル1000行、コード/Markdown/HTML 200KB、差分500KB、ファイル読み取り5MB、GIF最大60フレーム、GIFキャンバス最大8192×8192

監査ログ

タイムスタンプ付きイベントを含む構造化JSONログファイル（任意）

Chromiumサンドボックス

起動時にサンドボックスの利用可否をチェック

設定

MCPサーバーの環境変数：

変数

デフォルト

説明

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