Skip to main content
Glama

真实的终端配色、Shiki 高亮代码、可视化 diff、PDF 和 GIF——一个 MCP 服务器,13 个工具,零重型依赖。SSRF 防护默认开启。专为编写文档的智能体而构建,而不仅仅是驱动浏览器。

快速开始

三步,两分钟内完成:

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_terminalcapture_file——图片会保存到 ./captures/ 目录,并应用你的真实终端主题和所选语法主题。

OpenCodeopencode.json):

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

VS Code / Cline / Roo-Clinesettings.jsoncline.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(绿/红)

Markdown 渲染

为什么选择 snapmcp 而非 Playwright MCP

不同的工具适用于不同的任务。Playwright MCP 通过 token 高效的无障碍快照驱动浏览器;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)

Markdown → 样式化文档

capture_markdowncapture_to_document

浏览器页面截图

capture_browser(整页或视口)

浏览器自动化(点击、填写、导航)

❌ 仅截图

✅ 无障碍树驱动、token 高效——这才是正确的工具

大多数文档流水线会同时使用两者:Playwright MCP 负责交互,snapmcp 负责记录

工具

工具

描述

capture_terminal

带语法着色提示符的终端输出(自动检测真实终端主题)

capture_code

通过 Shiki 进行语法高亮的代码(50+ 种语言,27 种主题)

capture_browser

整页或视口截图(可用时使用系统 Chrome 配置文件)

capture_file

文件 → 自动检测语言 → 高亮截图

capture_markdown

将 Markdown 渲染为样式化文档

capture_html

将任意 HTML 片段渲染为图片

capture_diff

Git diff,绿色表示新增 / 红色表示删除

capture_pdf

URL → PDF 文档

capture_batch

一次调用批量捕获多个项目

capture_gif

从多张截图生成动画 GIF

capture_sequence

并排动画序列

capture_to_document

多章节 Markdown 文档渲染

snapmcp-hint

面向 MCP 客户端的服务器能力提示

使用场景

自动化文档——智能体编写安装指南并嵌入真实捕获:安装命令的终端输出(使用你的实际主题)、语法高亮的配置文件、迁移的 diff。一个提示词,三次 capture_* 调用,图片保存到 markdown 旁边。

可视化 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/810.0.0.0/8172.16.0.0/12192.168.0.0/16fc00::/7fe80::/10 等);每个页面请求(包括重定向)都会重新检查

文件白名单

SNAPMCP_ALLOWED_PATHS 未设置时默认拒绝所有路径;只有明确允许的路径才能被捕获

路径穿越防护

阻止 ../ 转义、符号链接穿越(通过 realpath)以及空字节注入

输入限制

终端 1000 行;代码/Markdown/HTML 200KB;diff 500KB;文件读取 5MB;最大 GIF 帧数 60;最大 GIF 画布 8192×8192

审计日志

可选的带时间戳事件的结构化 JSON 日志文件

Chromium 沙箱

启动时检查沙箱可用性

配置

MCP 服务器的环境变量:

变量

默认值

描述

SNAPMCP_DIR

./captures

截图输出目录

SNAPMCP_THEME

自动检测

语法主题(27 个内置主题 + 自动检测终端)

SNAPMCP_FORMAT

png

输出格式(pngjpeg

SNAPMCP_QUALITY

90

JPEG 质量(1-100)

SNAPMCP_PADDING

32

内容内边距(像素)

SNAPMCP_SHADOW

none

投影(nonesoftmediumstrong;别名 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 渠道(stablebetadevcanary

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

文档

页面

内容

快速入门

安装、快速上手、MCP 客户端配置

工具参考

全部 13 个工具的参数及示例

配置

所有 SNAPMCP_* 环境变量、主题、默认值

CLI 参考

init、doctor、test 命令

指南

终端截图、浏览器截图、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

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

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

  • 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
  • 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

  • MCP server for doc2mcp documentation, generated by doc2mcp.

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

  • 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