Menu
integrationsopenapipostmanchatgptmcpautomation

SnapSharp Everywhere: OpenAPI, Postman, ChatGPT, Claude MCP, and More

SnapSharp Team·March 27, 2026·8 min read

We believe a screenshot API should work where you work — not just as a raw HTTP endpoint. SnapSharp ships with a complete integration ecosystem: interactive API docs, Postman Collection, SDKs in five languages, MCP Server for AI assistants, and native support in n8n, Zapier, Make, and GitHub Actions.

Interactive API Reference (Swagger UI)

Browse every endpoint, parameter, and response schema at snapsharp.dev/api-docs. The reference is powered by Swagger UI with a dark theme and try-it-out enabled for every endpoint — authenticate with your API key and run live requests without leaving the browser.

Endpoints covered include:

EndpointDescription
GET /v1/screenshotCapture a URL as PNG, JPEG, WebP, or PDF
POST /v1/og-imageGenerate OG social cards from templates
POST /v1/html-to-imageRender arbitrary HTML/CSS to image
POST /v1/pdfGenerate PDF from URL or HTML template
POST /v1/batchCapture up to 100 URLs in one request
POST /v1/async/screenshotEnqueue a screenshot job (non-blocking)
GET /v1/jobs/:idPoll async job status
POST /v1/diffPixel-level visual diff of two images or URLs
GET /v1/site-auditExtract design tokens from any URL
POST /v1/extractExtract OG tags, meta, and favicons
POST /v1/analyzeAI-powered analysis of a screenshot
POST /v1/sitemap/crawlScreenshot every URL in a sitemap
POST /v1/videoRecord a page load as MP4 or GIF
GET /v1/usageCurrent quota, daily usage, and stats
GET /v1/templatesList available OG image templates

OpenAPI 3.0.3 Specification

The full machine-readable spec is served at:

https://api.snapsharp.dev/openapi.json

It's a valid OpenAPI 3.0.3 document with full schema definitions for every request body, response shape, and error code. You can import it into:

  • Insomnia — import collection, authenticate with your key, run requests
  • HTTPiehttpie plugins install httpie-openapi then import
  • Redoc — self-host your own documentation site
  • Speakeasy / openapi-typescript — generate type-safe client code for your language
  • Prism — mock server for local testing without hitting the real API

Generating a TypeScript client from the spec

npx openapi-typescript https://api.snapsharp.dev/openapi.json -o src/snapsharp.d.ts

Then use with your fetch client:

import type { paths } from './snapsharp.d.ts';
import createClient from 'openapi-fetch';

const client = createClient<paths>({ baseUrl: 'https://api.snapsharp.dev' });

const { data, error } = await client.GET('/v1/screenshot', {
  params: {
    query: { url: 'https://example.com', format: 'png', full_page: true },
  },
  headers: { Authorization: `Bearer ${process.env.SNAPSHARP_API_KEY}` },
});

This gives you fully type-safe API calls with autocomplete for all parameters.

Postman Collection

A pre-configured Postman Collection is available at:

https://snapsharp.dev/postman-collection.json

Import it into Postman Desktop → set the {{api_key}} collection variable → start testing. Every endpoint has a description, example request body, and documented response schema. The collection is organized by endpoint category (screenshots, OG images, monitoring, batch, etc.).

Quick start:

  1. Open Postman → Import → Link → paste the URL above
  2. Click the collection → Variables tab → set api_key to your key
  3. Open any request → Send

The collection also includes a pre-request script that logs X-Request-Id for debugging — useful when correlating requests with your Axiom logs.

Language SDKs

SnapSharp ships official SDKs for five languages:

Node.js / TypeScript

npm install @snapsharp/sdk
import { SnapSharp } from '@snapsharp/sdk';

const snap = new SnapSharp({ apiKey: process.env.SNAPSHARP_API_KEY });

// Screenshot
const image = await snap.screenshot({ url: 'https://github.com', fullPage: true, format: 'png' });
await fs.writeFile('screenshot.png', image);

// OG image
const og = await snap.ogImage({ template: 'blog-post', data: { title: 'Hello World', author: 'John' } });

Python

pip install snapsharp
from snapsharp import SnapSharp

snap = SnapSharp(api_key=os.getenv("SNAPSHARP_API_KEY"))

image_bytes = snap.screenshot(url="https://stripe.com", dark_mode=True, format="jpeg")
with open("stripe-dark.jpg", "wb") as f:
    f.write(image_bytes)

Go

go get github.com/snapsharp/sdk-go
client := snapsharp.New(os.Getenv("SNAPSHARP_API_KEY"))
img, err := client.Screenshot(ctx, &snapsharp.ScreenshotParams{
    URL:      "https://example.com",
    FullPage: true,
    Format:   "png",
})

SDKs for Ruby and PHP follow the same pattern. All SDKs are open source and available on GitHub under @snapsharp/sdk-*.

CLI

The CLI is the fastest way to use SnapSharp from the terminal or CI pipeline:

npx snapsharp-cli screenshot --url https://example.com --format png --output screenshot.png
npx snapsharp-cli og-image --template blog-post --title "Hello" --author "Me" --output card.jpg
npx snapsharp-cli site-audit --url https://stripe.com --format json

Set SNAPSHARP_API_KEY in your environment and the CLI will pick it up automatically. The --output flag accepts a file path or - to pipe to stdout.

Claude MCP Server (AI-native integration)

SnapSharp ships a native MCP (Model Context Protocol) server that works with Claude Desktop, Cursor, and Windsurf. This means your AI assistant can take screenshots, run site audits, generate OG images, and query usage stats — without leaving the editor.

Install the MCP server

npm install -g snapsharp-mcp

Configure Claude Desktop

Add to ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "snapsharp": {
      "command": "snapsharp-mcp",
      "env": {
        "SNAPSHARP_API_KEY": "sk_live_your_key_here"
      }
    }
  }
}

Restart Claude Desktop. You can now ask:

  • "Take a screenshot of stripe.com in dark mode"
  • "Run a site audit on our competitor's homepage and show me their color palette"
  • "Generate an OG image for this blog post"
  • "Check my API usage for this month"

Configure Cursor

Add to your Cursor MCP settings:

{
  "snapsharp": {
    "command": "snapsharp-mcp",
    "env": { "SNAPSHARP_API_KEY": "sk_live_..." }
  }
}

Available MCP tools: take_screenshot, generate_og_image, run_site_audit, render_html_to_image, get_usage, list_monitors, create_monitor.

ChatGPT GPT Action

Turn ChatGPT into a screenshot and design tool by adding a GPT Action:

  1. Open ChatGPT → My GPTs → Create a GPT
  2. Go to the Configure tab → ActionsAdd action
  3. Import from URL: https://api.snapsharp.dev/openapi.json
  4. Authentication: API Key → Bearer → paste your API key
  5. Save

ChatGPT now has access to all SnapSharp endpoints. Example prompts:

  • "Screenshot https://linear.app and describe the navigation structure"
  • "Create an OG image card for a post titled 'Building a Screenshot API'"
  • "Audit https://figma.com and tell me what fonts they use"

GitHub Actions

Integrate screenshots into your CI/CD pipeline for visual regression testing or automated documentation:

name: Visual Regression

on: [pull_request]

jobs:
  screenshot:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Capture PR preview screenshot
        run: |
          curl -s "https://api.snapsharp.dev/v1/screenshot?url=${{ vars.PREVIEW_URL }}&full_page=true&format=png" \
            -H "Authorization: Bearer ${{ secrets.SNAPSHARP_API_KEY }}" \
            --output pr-preview.png

      - name: Upload screenshot artifact
        uses: actions/upload-artifact@v4
        with:
          name: pr-preview
          path: pr-preview.png

For visual diff in CI, use the diff endpoint to compare the PR preview against the production baseline:

      - name: Visual diff vs production
        run: |
          DIFF=$(curl -s -X POST "https://api.snapsharp.dev/v1/diff" \
            -H "Authorization: Bearer ${{ secrets.SNAPSHARP_API_KEY }}" \
            -H "Content-Type: application/json" \
            -d '{"url_a": "${{ vars.PROD_URL }}", "url_b": "${{ vars.PREVIEW_URL }}"}')
          DIFF_PCT=$(echo $DIFF | jq '.diff_percent')
          echo "Visual diff: ${DIFF_PCT}%"
          if (( $(echo "$DIFF_PCT > 5" | bc -l) )); then
            echo "::warning::Visual diff exceeds 5% threshold"
          fi

n8n

Use SnapSharp in n8n workflows for automated screenshot pipelines:

HTTP Request node setup:

  • Method: GET
  • URL: https://api.snapsharp.dev/v1/screenshot
  • Authentication: Header Auth → AuthorizationBearer YOUR_KEY
  • Query parameters: url, format, full_page, etc.
  • Response format: Binary

Example workflow: Google Sheets row added → SnapSharp screenshot → upload to Google Drive → send Slack notification with image.

For OG images:

  • Method: POST
  • Body (JSON): {"template": "blog-post", "data": {"title": "{{$json.title}}", "author": "{{$json.author}}"}}

Zapier

Create a Zap with the Webhooks by Zapier action:

  • Method: GET
  • URL: https://api.snapsharp.dev/v1/screenshot
  • Query string params: url=YOUR_URL&format=jpeg&quality=85
  • Headers: Authorization: Bearer sk_live_...
  • Response type: file (Zapier will handle the binary)

Trigger from: Google Sheets row updated, Notion database item, Airtable record created, or any of Zapier's 6,000+ app triggers.

Make (Integromat)

In Make, add an HTTP module:

  1. Make a request → URL: screenshot endpoint → Method: GET
  2. Add query parameters: url, format, full_page
  3. Headers: Authorization: Bearer YOUR_KEY
  4. Parse response: Binary → connect to a Google Drive, Dropbox, or Slack module

Chain with an Iterator module to process a list of URLs from a Google Sheet and screenshot each one.

RapidAPI

SnapSharp is listed on the RapidAPI marketplace for teams that prefer billing and key management centralized in RapidAPI's ecosystem:

https://snapsharp.dev/openapi-rapidapi.json

Subscribe on RapidAPI for access with RapidAPI credentials. The spec is identical to the public API — same parameters, same response formats.

Why this matters for teams

Most screenshot APIs give you a REST endpoint and documentation. SnapSharp gives you:

  • Interactive docs you can explore and test without writing any code
  • Postman Collection ready to import in 10 seconds, pre-wired with auth
  • SDKs in 5 languages so you don't write raw fetch calls
  • MCP Server so AI assistants (Claude, Cursor, Windsurf) can use the API natively
  • GPT Action for ChatGPT integration with no code
  • CLI for shell scripts, cron jobs, and CI pipelines
  • OpenAPI spec for automated client code generation in any language
  • No-code support via n8n, Zapier, and Make — so non-engineers can automate too

One API. Every platform.

Windsurf and Cursor — detailed MCP setup

Both editors use the same MCP protocol but store config in slightly different locations.

Cursor

In Cursor, open Settings → Features → MCP Servers and add a new entry, or edit ~/.cursor/mcp.json directly:

{
  "mcpServers": {
    "snapsharp": {
      "command": "npx",
      "args": ["-y", "snapsharp-mcp"],
      "env": {
        "SNAPSHARP_API_KEY": "sk_live_your_key_here"
      }
    }
  }
}

After saving, restart Cursor. You'll see SnapSharp tools appear in the MCP panel. Ask the AI: "Screenshot the current URL open in my browser and analyze the layout" — the agent will call take_screenshot and run_site_audit automatically.

Windsurf

Windsurf reads MCP config from ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "snapsharp": {
      "command": "npx",
      "args": ["-y", "snapsharp-mcp"],
      "env": {
        "SNAPSHARP_API_KEY": "sk_live_your_key_here"
      }
    }
  }
}

Restart Windsurf after editing. The Cascade assistant will have access to all SnapSharp tools in its tool list.

Available MCP tools reference

ToolDescriptionPlan
take_screenshotCapture a URL as PNG/JPEGFree+
generate_og_imageRender a template to OG cardFree+
render_html_to_imageConvert HTML string to imageFree+
run_site_auditExtract design tokens from URLStarter+
get_usageCurrent quota and daily statsFree+
list_monitorsList active visual monitorsStarter+
create_monitorSet up new visual monitorStarter+

Type-safe client generation from the OpenAPI spec

The OpenAPI 3.0.3 spec at https://api.snapsharp.dev/openapi.json is machine-readable — you can generate a fully type-safe client in any language in minutes.

TypeScript (openapi-typescript + openapi-fetch)

npx openapi-typescript https://api.snapsharp.dev/openapi.json -o src/snapsharp.d.ts
npm install openapi-fetch
import createClient from 'openapi-fetch';
import type { paths } from './snapsharp.d.ts';

const client = createClient<paths>({
  baseUrl: 'https://api.snapsharp.dev',
  headers: { Authorization: `Bearer ${process.env.SNAPSHARP_API_KEY}` },
});

// Fully typed — TypeScript knows all valid params and response shapes
const { data, error } = await client.GET('/v1/screenshot', {
  params: {
    query: {
      url: 'https://stripe.com',
      format: 'png',
      full_page: true,
      dark_mode: true,
    },
  },
});

if (error) throw new Error(`Screenshot failed: ${JSON.stringify(error)}`);
// `data` is typed as the binary response

Python (openapi-python-client)

pip install openapi-python-client
openapi-python-client generate --url https://api.snapsharp.dev/openapi.json

This generates a Python package with typed models for every request/response. Import and use:

from snapsharp_client import Client
from snapsharp_client.api.screenshots import get_v1_screenshot

client = Client(base_url="https://api.snapsharp.dev", headers={"Authorization": f"Bearer {api_key}"})
response = get_v1_screenshot.sync(client=client, url="https://example.com", format_="png")

Go (oapi-codegen)

go install github.com/deepmap/oapi-codegen/cmd/oapi-codegen@latest
oapi-codegen -generate types,client -package snapsharp https://api.snapsharp.dev/openapi.json > snapsharp_client.go

Generated Go client with full type safety for all endpoints and parameters.

Using Prism for local mock testing

Prism turns your OpenAPI spec into a mock server — no real API calls, no quota consumption, perfect for testing your integration in CI:

npx @stoplight/prism-cli mock https://api.snapsharp.dev/openapi.json
# Prism is now listening on http://127.0.0.1:4010

Point your test suite at http://127.0.0.1:4010 instead of https://api.snapsharp.dev. Prism will:

  • Validate your request parameters against the schema
  • Return example responses from the spec
  • Reject requests with invalid parameters (404/422)

This means your integration tests can run in CI without network calls or API keys. They validate the contract between your code and the API spec.

// vitest / jest example
const TEST_BASE_URL = process.env.CI
  ? 'http://127.0.0.1:4010' // Prism mock in CI
  : 'https://api.snapsharp.dev'; // Real API in local dev

const res = await fetch(`${TEST_BASE_URL}/v1/screenshot?url=https://example.com`, {
  headers: { Authorization: `Bearer ${process.env.SNAPSHARP_API_KEY ?? 'test-key'}` },
});
expect(res.status).toBe(200);

Slack slash command integration

You can wire a Slack slash command to SnapSharp in under 30 minutes using Slack's HTTP trigger + a serverless function.

Architecture: /screenshot https://stripe.com → Slack sends POST to your function → function calls SnapSharp → uploads PNG to Slack channel.

// pages/api/slack/screenshot.ts (or any serverless function)
import type { NextApiRequest, NextApiResponse } from 'next';

export default async function handler(req: NextApiRequest, res: NextApiResponse) {
  // Slack sends command in body as application/x-www-form-urlencoded
  const text = String(req.body.text ?? '').trim();
  if (!text.startsWith('http')) {
    return res.json({ text: 'Usage: /screenshot <url>' });
  }

  // Acknowledge Slack immediately (3s timeout)
  res.json({ text: `Taking screenshot of ${text}...` });

  // Process async
  const screenshotRes = await fetch(
    `https://api.snapsharp.dev/v1/screenshot?url=${encodeURIComponent(text)}&format=png&full_page=true`,
    { headers: { Authorization: `Bearer ${process.env.SNAPSHARP_API_KEY}` } },
  );

  if (!screenshotRes.ok) return;

  const imageBuffer = Buffer.from(await screenshotRes.arrayBuffer());

  // Upload to Slack
  const form = new FormData();
  form.append('channels', req.body.channel_id);
  form.append('filename', 'screenshot.png');
  form.append('file', new Blob([imageBuffer], { type: 'image/png' }), 'screenshot.png');

  await fetch('https://slack.com/api/files.upload', {
    method: 'POST',
    headers: { Authorization: `Bearer ${process.env.SLACK_BOT_TOKEN}` },
    body: form,
  });
}

Set up in Slack: Apps → Slash Commands → Create New Command → point to your function URL → add screenshot as the command. Team members can now screenshot any URL directly in Slack.


API Reference → · SDK Docs → · Integrations docs → · Get your API key →


Related: Integrations docs · Pricing · Real-Time Screenshot Notifications with Webhooks · Screenshot API Comparison 2026

SnapSharp Everywhere: OpenAPI, Postman, ChatGPT, Claude MCP, and More — SnapSharp Blog