JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 3
  • Score
    100M100P100Q42469F
  • License MIT

A production-ready tool for capturing and processing web screenshots with Puppeteer and Sharp.

Package Exports

  • snipify

Readme

Snipify πŸ“Έ

npm version npm downloads MIT License TypeScript

Snipify is a production-ready toolkit for capturing, resizing, and exporting high-quality web screenshots using Puppeteer and Sharp.

"From page to pixel-perfect screenshotβ€”automate it all." πŸš€


🌟 Features

  • Full & Viewport Modes – Capture the entire page or just the visible area
  • Custom Device Emulation – Desktop, mobile, tablet & more with custom user-agents
  • Smart Resource Blocking – Skip heavy/irrelevant assets like analytics & media
  • Image Processing with Sharp – Resize, crop, compress effortlessly
  • Pure TypeScript – Strictly typed and modern API
  • No Bloat – Minimal dependencies, fast and efficient

πŸ“¦ Installation

npm install snipify
# or
yarn add snipify
# or
bun add snipify

πŸš€ Quick Start

import { captureScreenshot } from "snipify";

const { base64 } = await captureScreenshot("https://example.com", "desktop", {
  mode: "full",
  format: "jpeg",
  quality: 80,
});

✨ Core API

πŸ“Έ captureScreenshot(url, device?, options?)

Capture a screenshot and get a base64 string.

const result = await captureScreenshot("https://example.com", "mobile", {
  mode: "viewport",
  format: "png",
});

Parameters

Name Type Description
url string Web page URL
device `'desktop' \ 'mobile' \ 'tablet' ...` Emulated device (default: desktop)
options { mode, format, quality, ... } Screenshot options

πŸ“ Resize Options

You can resize screenshots automatically:

await captureScreenshot("https://example.com", "desktop", {
  mode: "full",
  fixedSize: { width: 800, height: 600 },
});

βš™οΈ Options

interface ScreenshotOptions {
  format?: 'png' | 'jpeg';
  quality?: number;
  mode?: 'full' | 'viewport';
  waitForSelector?: string;
  delay?: number;
  headless?: boolean;
  blockResources?: boolean;
  clip?: { x: number; y: number; width: number; height: number };
  fixedSize?: { width: number; height: number };
}

🧠 Why Snipify?

  • Production Ready – Battle-tested setup with error handling
  • Fast – Puppeteer + Sharp combo for fast, clean output
  • Zero UI Dependency – Works anywhere Node.js runs
  • Typed First – Built for TypeScript users
  • Modular – Customize device presets, screenshot settings & more

πŸ› οΈ Contributing

git clone https://github.com/kiron0/snipify.git
cd snipify
bun install
bun run build

Issues and PRs are warmly welcome 🀝


πŸ“œ License

MIT Β© Toufiq Hasan Kiron

β€œSnip it. Sharpen it. Ship it.” – Snipify Motto πŸ“Έ