Share screenshots directly in Slack
Capture and post website screenshots to any Slack channel
Build screenshot-powered Slack workflows. Capture any URL and post the screenshot directly to a channel, send visual alerts when websites change, or build a slash command that lets teammates request screenshots on demand.
Set up a Slack app
Create a Slack app with an incoming webhook or slash command.
Capture the screenshot
When triggered, call the Allscreenshots API with the target URL.
Post to the channel
Use the Slack webhook to post the screenshot image to the channel.
Add slash commands
Optionally create a /screenshot slash command for on-demand captures.
1// Handle /screenshot slash command
2export async function POST(request) {
3 const formData = await request.formData();
4 const url = formData.get('text');
5 const responseUrl = formData.get('response_url');
6
7 // Capture screenshot
8 const response = await fetch(
9 'https://api.allscreenshots.com/v1/screenshot',
10 {
11 method: 'POST',
12 headers: {
13 'Authorization': `Bearer ${process.env.SCREENSHOT_API_KEY}`,
14 'Content-Type': 'application/json',
15 },
16 body: JSON.stringify({
17 url,
18 viewport: { width: 1920, height: 1080 },
19 }),
20 }
21 );
22
23 const { screenshotUrl } = await response.json();
24
25 // Post screenshot back to Slack
26 await fetch(responseUrl, {
27 method: 'POST',
28 headers: { 'Content-Type': 'application/json' },
29 body: JSON.stringify({
30 response_type: 'in_channel',
31 blocks: [
32 {
33 type: 'image',
34 image_url: screenshotUrl,
35 alt_text: `Screenshot of ${url}`,
36 title: { type: 'plain_text', text: url },
37 },
38 ],
39 }),
40 });
41
42 return new Response('', { status: 200 });
43}Instant visual context
Share what a page looks like right now without asking teammates to click a link.
Slash command convenience
Type /screenshot URL in any channel to get an instant capture.
Automated alerts
Post screenshots to Slack channels automatically when websites change or deployments complete.