Building an Internal Screenshot Review Tool with Retool

Not everyone who needs to trigger a screenshot or a visual diff should need API access or a terminal. QA, support, and marketing teams often just need a form: paste a URL, click a button, see the result. Retool is a natural fit for that — it can call any REST API as a resource, which is all a Snapshot Site request is.

This walks through wiring the Snapshot Site API into Retool as a resource and building a minimal review app on top of it.

What the App Does

1. A form with a URL input and a "Capture" button.
2. A query that calls Snapshot Site's screenshot endpoint with the entered URL.
3. An image component that displays the returned screenshot.
4. A second form for comparing two URLs via the compare endpoint, showing the diff image and mismatch percentage.

Step 1: Add Snapshot Site as a REST API Resource

In Retool's resource settings, add a new REST API resource:

• Base URL: https://api.prod.ss.snapshot-site.com
• Headers: x-snapshotsiteapi-key set to your API key (store this as an environment variable in Retool, not hardcoded in the resource config)

This one resource covers every endpoint — v1, v2, v3/analyze, and v3/compare are all just different paths on the same base.

Step 2: Build the Capture Query

Add a query on the new resource:

• Method: POST
• Path: /api/v1/screenshot
• Body:

{
  "url": "{{ urlInput.value }}",
  "format": "png",
  "width": 1440,
  "fullSize": true,
  "hideCookie": true
}

{{ urlInput.value }} binds to the text input component where someone pastes the URL to capture. Wire the "Capture" button's onClick to run this query, and bind an Image component's source to the query's response field containing the screenshot URL.

Step 3: Add a Compare Query

For the diff-review half of the app, add a second query pointed at /api/v3/compare:

{
  "before": {"url": "{{ beforeUrlInput.value }}", "width": 1440, "fullSize": true, "hideCookie": true},
  "after": {"url": "{{ afterUrlInput.value }}", "width": 1440, "fullSize": true, "hideCookie": true},
  "threshold": 0.1
}

Bind three Image components to the response's before, after, and diff image fields, and a Text component to the mismatch percentage, so a reviewer sees all three states plus the number in one screen.

Why an Internal Tool Beats Asking for API Access

Handing out API keys to everyone who occasionally needs a screenshot creates a key-management problem and a support burden. A Retool app built once, shared with the right group, and backed by a single service-level API key gives non-technical teammates a self-serve way to run the exact same requests a developer would, without touching a terminal or a script.

Extending the App

Once the basic form works, natural additions include:

• A table component listing recent captures, backed by a Retool-managed table or a lightweight database, so results aren't lost after the session ends.
• A scheduled trigger in Retool Workflows that runs the same query on a recurring basis for a fixed watch list, similar to the pattern in Visual Uptime Monitoring.
• A Slack action that posts the result to a channel, using Retool's built-in Slack integration alongside the Snapshot Site resource.

For teams that already build internal tools in Retool, Snapshot Site slots in as one more REST resource — no separate service to stand up, no browser dependency to manage.