DEV Community

Pini Solomon
Pini Solomon

Posted on

How to Capture Website Screenshots with a Simple API Call

#api #javascript #tutorial #webdev

Ever needed to generate a screenshot of a webpage programmatically? Whether you're building a link preview feature, monitoring website changes, or generating PDF reports — setting up headless Chrome yourself is a pain.

I built ScreenshotAPI to solve this. One GET request, instant screenshot or PDF back. No browser setup, no Puppeteer dependencies, no infrastructure headaches.

The Problem

If you've tried capturing screenshots programmatically, you know the drill:

  • Install Puppeteer or Playwright (500MB+ of Chromium)
  • Handle browser crashes and memory leaks
  • Deal with timeout issues on slow-loading pages
  • Manage a browser pool for concurrent requests
  • Deploy it all on a server with enough RAM

For most use cases, this is massive overkill. You just want an image of a webpage.

The Solution: One API Call 

curl "https://screenshotapi5.p.rapidapi.com/v1/screenshot?url=https://github.com" \
  -H "X-RapidAPI-Key: YOUR_KEY" \
  -H "X-RapidAPI-Host: screenshotapi5.p.rapidapi.com" \
  -o screenshot.png
Enter fullscreen mode Exit fullscreen mode

That's it. You get back a PNG screenshot. No setup, no dependencies.

What You Can Do

1. Website Screenshots

Capture any public webpage as PNG or JPEG:

const axios = require('axios');
const fs = require('fs');

const response = await axios.get('https://screenshotapi5.p.rapidapi.com/v1/screenshot', {
  params: {
    url: 'https://stripe.com',
    width: 1280,
    height: 800,
    format: 'png'
  },
  headers: {
    'X-RapidAPI-Key': 'YOUR_KEY',
    'X-RapidAPI-Host': 'screenshotapi5.p.rapidapi.com'
  },
  responseType: 'arraybuffer'
});

fs.writeFileSync('stripe.png', response.data);
Enter fullscreen mode Exit fullscreen mode

2. Full-Page Screenshots

Capture the entire scrollable page, not just the viewport:

?url=https://example.com&fullPage=true
Enter fullscreen mode Exit fullscreen mode

3. Element Screenshots

Target a specific element with a CSS selector:

?url=https://example.com&selector=.hero-section
Enter fullscreen mode Exit fullscreen mode

4. PDF Generation

Generate a PDF of any webpage:

curl "https://screenshotapi5.p.rapidapi.com/v1/pdf?url=https://example.com&format=A4" \
  -H "X-RapidAPI-Key: YOUR_KEY" \
  -H "X-RapidAPI-Host: screenshotapi5.p.rapidapi.com" \
  -o page.pdf
Enter fullscreen mode Exit fullscreen mode

5. Custom Viewport & Quality 

?url=https://example.com&width=1920&height=1080&format=jpeg&quality=90
Enter fullscreen mode Exit fullscreen mode

Real-World Use Cases

  • Link Previews: Generate Open Graph images for social sharing
  • Website Monitoring: Take periodic screenshots to detect visual changes
  • Automated Reports: Convert dashboards to PDFs for email distribution
  • Thumbnail Generation: Create preview thumbnails for URL directories
  • Archiving: Save visual snapshots of web pages for compliance

Full Parameter Reference

Screenshot Endpoint (GET /v1/screenshot)

Parameter Default Description
url required URL to capture
width 1280 Viewport width in pixels
height 800 Viewport height in pixels
fullPage false Capture full scrollable page
format png Output format: png or jpeg
quality 80 JPEG quality (1-100)
delay 0 Wait time in ms before capture
selector — CSS selector to capture specific element

PDF Endpoint (GET /v1/pdf)

Parameter Default Description
url required URL to capture
format A4 Page format: A4, Letter, Legal
landscape false Landscape orientation
printBackground true Include CSS backgrounds
scale 1 Scale factor (0.1 to 2)

Pricing

  • Free: 50 requests/month (great for testing)
  • Pro: $9/month — 1,000 requests
  • Ultra: $29/month — 5,000 requests
  • Mega: $79/month — 25,000 requests

Get Started

  1. Go to ScreenshotAPI on RapidAPI
  2. Subscribe to the free plan
  3. Copy your API key
  4. Start capturing screenshots

It takes about 30 seconds to go from zero to your first screenshot.

Built with Node.js, Playwright, and deployed on Railway. If you have questions or feature requests, reach out through the RapidAPI listing.

Top comments (0)