How to Screenshot a Specific Element on a Page

Capture just one element on a page by CSS selector. Perfect for charts, tables, hero sections, or any DOM element.

Steps

1. Find the CSS selectorUse browser DevTools to find the element's CSS selector (e.g., #main-chart, .hero-section, table.data).
2. Add the selector parameterSet selector=#main-chart in your request. SnapAPI finds that element and captures only its bounding box.
3. Get a clean cropThe result is a tightly cropped image of just that element — no extra whitespace.

Code Examples

curl "https://snapapi.tech/v1/screenshot?url=https://example.com&api_key=YOUR_KEY&selector=%23main-content" -o element.png

import requests

response = requests.get("https://snapapi.tech/v1/screenshot", params={
    "url": "https://example.com",
    "api_key": "YOUR_KEY",
    "selector": "#main-content"
})
with open("element.png", "wb") as f:
    f.write(response.content)

const res = await fetch(
  "https://snapapi.tech/v1/screenshot?" + new URLSearchParams({
    url: "https://example.com",
    api_key: "YOUR_KEY",
    selector: "#main-content"
  })
);
require("fs").writeFileSync("element.png", Buffer.from(await res.arrayBuffer()));