Overview
Code Screenshot Generator MCP is an MCP server that enables Claude to render high-quality, syntax-highlighted code screenshots using professional themes. It supports reading code directly from files with line-range selection, showing git diffs (staged or unstaged), and batch processing multiple files. It automatically detects the programming language when given a file, supports over 20 languages, and offers five themes: Dracula, Nord, Monokai, GitHub Light, and GitHub Dark. The server provides API endpoints for generating screenshots from code strings, from files, or from git diffs, and a batch API that returns multiple PNGs with status. It integrates natively with Claude Desktop and Claude Code, and relies on tools like Playwright and Highlight.js for rendering. Installation includes a global npm install, quick Claude Code setup, or manual Claude Desktop config. The project uses TypeScript and is built for developers who want to automate code visuals in documentation, tutorials, or presentations.
Features
Professional Themes
Offers five themes (Dracula, Nord, Monokai, GitHub Light, GitHub Dark) for high-quality visuals.
File Integration with Line Range
Screenshot code directly from files with start and end line range support.
Git Diff Visualization
Visualize staged or unstaged changes in the code being screenshot.
Batch Processing
Process multiple files in a single operation to generate multiple screenshots.
Auto Language Detection
Automatically detects language for broad language support (20+ languages).
Native Claude Integration
Works seamlessly with Claude Desktop and Claude Code for smooth workflows.
Who Is This For?
- Claude users:Generate syntax-highlighted code screenshots directly within Claude prompts.
- Documentation teams:Create visuals for docs and tutorials using file-based or diff-based screenshots.
- Developers:Integrate screenshot capabilities into coding workflows and tooling.
