npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

snipshot

v1.0.4

Published

Generate PNG screenshots of code snippets with syntax highlighting, line numbers, and colored annotations from the CLI

Readme




Features

  • Syntax highlighting for 200+ languages via Shiki (VS Code-quality tokenization)
  • Line numbers with proper gutter alignment
  • Red/green highlights — full lines or precise column ranges
  • Fold/collapse line ranges to hide boilerplate with --fold
  • Context lines — 3 lines around your selection by default (--context / --no-context)
  • Page-fit guard — errors past 70 rendered rows so snippets fit on a page (--max-lines / --no-max-lines)
  • Page-width word wrap — long lines wrap to fit a document by default (--max-width / --no-max-width)
  • Automatic language detection from 150+ file extensions, with graceful plaintext fallback for unknown types
  • Dark & light themes — One Dark Pro (default) or One Light via --theme
  • Offline — everything runs locally, no network needed
  • Standalone binaries for Linux, Windows, and macOS (via Bun compile)

Install

# npm (requires Node.js >= 18)
npm install -g snipshot

# or run directly
npx snipshot <file> --lines <range>

Usage

snipshot <file> --lines <start>-<end> [options]

Options

| Option | Description | |---|---| | --lines <range> | Line range to capture, e.g. 42-56 (required) | | --highlight-red <specs> | Red highlights — comma-separated and/or repeatable | | --highlight-green <specs> | Green highlights — comma-separated and/or repeatable | | --fold <ranges> | Collapse line ranges into a single indicator row — comma-separated and/or repeatable | | --context <n> | Lines of context before/after --lines, clamped to the file (default: 3) | | --no-context | Show exactly the requested lines | | --max-lines <n> | Error if the result exceeds this many rows so it fits a page (default: 70) | | --no-max-lines | Disable the rows limit | | --theme <name> | Color theme: dark (default) or light | | --max-width <pixels> | Max image width with word wrap (default: 800 ≈ a page width) | | --no-max-width | Disable word wrap (image grows to the longest line) | | --output <path> | Output file path (default: <name>_L<start>-<end>.png) | | --root <path> | Project root for the header path (default: nearest .git above the file, else the current directory) |

Running snipshot with no arguments prints this help.

Highlight / fold format

Each --highlight-* and --fold flag takes one or more comma-separated targets (and can be repeated):

47           # entire line 47
47-50        # lines 47 through 50
47:12-38     # line 47, columns 12 to 38 (highlights only — draws a box)
13,15-18     # several at once in a single flag

All numbers are 1-based and inclusive.

Examples

# Basic screenshot (3 context lines added automatically)
snipshot src/App.java --lines 42-56

# Multiple highlights in one flag
snipshot src/App.java --lines 42-56 --highlight-red 47,50-52 --highlight-green 55:12-38

# Wider lines (override the default page-width wrap), or disable wrapping
snipshot src/App.java --lines 1-20 --max-width 1100
snipshot src/App.java --lines 1-20 --no-max-width

# Fold boilerplate to focus on what matters
snipshot src/App.java --lines 1-80 --fold 5-30,60-70

# Exactly the requested lines, no context
snipshot src/App.java --lines 42-56 --no-context

# Large extract that exceeds the 70-row page-fit limit
snipshot src/App.java --lines 1-200 --no-max-lines

# Light theme
snipshot src/App.java --lines 42-56 --theme light

# Custom output path
snipshot src/App.java --lines 42-56 --output screenshot.png

Examples

TypeScript with interface highlight and column annotation:

Long lines wrapped to a fixed width, with mixed highlights:

Clean output without highlights:

Light theme (--theme light)

Syntax highlighting:

Red/green annotations:

Folded region:

Standalone binaries

Pre-built binaries include the Bun runtime — no Node.js installation needed on the target machine.

Download

Grab the archive for your platform from Releases, extract it, and run:

./snipshot src/App.java --lines 10-30

Build from source

Requires Bun:

# All platforms (linux, win, mac-intel, mac-arm)
npm run build:standalone

# Specific platform
npm run build:standalone:linux
npm run build:standalone:win
npm run build:standalone:mac-intel
npm run build:standalone:mac-arm
npm run build:standalone:mac      # both macOS arches

# Or call the script directly (also supports comma-separated platforms)
node scripts/build-standalone.mjs linux,win

Each platform builds to its own folder — standalone/<os>/snipshot (or snipshot.exe on Windows):

standalone/
├── linux/snipshot
├── win/snipshot.exe
├── mac-intel/snipshot
└── mac-arm/snipshot

Every binary is a single self-contained file.

Install system-wide (Linux/macOS):

sudo cp standalone/linux/snipshot /opt/snipshot
sudo ln -s /opt/snipshot /usr/local/bin/snipshot

How it works

  1. Reads the full source file (not just the requested lines) to ensure accurate syntax highlighting
  2. Tokenizes with Shiki using the One Dark Pro theme (or One Light with --theme light)
  3. Renders to a canvas with @napi-rs/canvas (Skia-based, no browser needed)
  4. Exports as PNG

The font used is JetBrains Mono (bundled).

Development

git clone https://github.com/n8tz/snipshot.git
cd snipshot
npm install

npm run build        # compile TypeScript
npm test             # run tests (34 tests)
npm run test:watch   # watch mode

License

MIT