Configures and uses snipgrapher to generate polished code snippet images, including syntax-highlighted PNGs, SVGs, and WebP exports with custom themes, profiles, and styling options. Use when the user wants to create code screenshots, turn code into shareable images, generate pretty code snippets for docs or social posts, produce syntax-highlighted images from source files, or explicitly mentions snipgrapher. Supports single-file renders, batch jobs, watch mode, and reusable named profiles via the snipgrapher CLI or npx.
97
97%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Advisory
Suggest reviewing before use
Set up snipgrapher so snippet rendering is deterministic and easy to repeat.
Use one of these:
snipgraphernpx --yes snipgrapher doctorCreate a baseline config in the current project:
snipgrapher initSupported config filenames (first match wins):
snipgrapher.config.jsonsnipgrapher.config.yamlsnipgrapher.config.ymlsnipgrapher.config.tomlUse a config structure like:
{
"theme": "nord",
"fontFamily": "Fira Code",
"fontSize": 14,
"padding": 32,
"lineNumbers": true,
"windowControls": true,
"shadow": true,
"backgroundStyle": "gradient",
"format": "svg",
"defaultProfile": "default",
"profiles": {
"default": {},
"social": {
"padding": 48,
"fontSize": 16,
"watermark": "@your-handle"
}
}
}Run:
snipgrapher doctor
snipgrapher themes listFix validation errors before rendering.
Rendering values resolve as:
CLI flags > environment variables > config file > defaults
Useful env vars include:
SNIPGRAPHER_PROFILESNIPGRAPHER_THEMESNIPGRAPHER_FORMATSNIPGRAPHER_FONT_SIZESNIPGRAPHER_PADDINGSNIPGRAPHER_LINE_NUMBERSUse env vars for CI-wide defaults, and CLI flags for one-off overrides.