Screenshots · checked 2026-10-19Can I vibecode Shots.so?
YES· one-shottable
A screenshot beautifier is a canvas: pick a background, round the corners, add a shadow and a window frame, export a PNG. An agent writes that in one sitting and it can run entirely in your browser, so the screenshot never leaves your machine. What Shots charges for is the finish around it: realistic device mockups, 3D shapes, generated backgrounds and zoom animations rendered as 2K video. A basic zoom clip is a follow-up evening with WebCodecs, but expect neither their library nor their look. A free open-source option already exists, so look at ShotCandy before you build.
$10/moprice
$120you'd save a year
one sittingbuild time
—people replaced it
What you need on hand.
DifficultyBeginner · No setup beyond your agent.
TimeOne to two hours for stills; an evening more for video
- Claude Code, Codex or CursorAny of them can run the prompt.
- Node.js 22Everything is front-end code, so nothing needs compiling.
- A current browserChrome or Edge if you add the video follow-up.
Before you buildShots Free already exports PNG with the style tools. If you do not make video, try it and ShotCandy before building anything.
- 1. Install one agent: Claude Code, Codex, Cursor.
- 2. Make an empty folder and open it in the agent.
- 3. Paste the prompt below, press enter, and answer its questions as it builds.
The prompt
Build me a screenshot beautifier to replace Shots for still images. Requirements: - Vite + React + TypeScript single-page app; `npm run dev` serves http://localhost:5180. Rendering is an HTML canvas with no server, so nothing is ever uploaded. - Input: paste (Cmd or Ctrl+V), drag and drop, or a file picker for PNG, JPEG and WebP; keep the original at full resolution. - Side panel: padding (0 to 200 px), corner radius, shadow (offset, blur, opacity) and a background that is a solid colour, a two-stop gradient with an angle, or an uploaded image with a blur slider. - Frames drawn in code, with no copied artwork: none, a macOS-style window, a browser window with an editable URL text, and a plain phone outline; plus a "glass" border option. - Presets as JSON in ./presets/ (name and every control value): ship 8, and let me save my own in localStorage. - Export: PNG at 1x, 2x or 3x through `canvas.toBlob`, "Copy to clipboard" through the Clipboard API, and size presets 1200x630, 1600x900, 1080x1080 and 1080x1920 that centre the framed image on a canvas of that size. - Batch: drop up to 20 files, apply the current preset and download one ZIP built with `fflate`. - Tests (Vitest): the layout maths is deterministic, and with frame "none" a 2x export of a 1000x600 input with 80 px padding is exactly 2320x1520 pixels. - Single user. No accounts, no telemetry, local-first: the app makes no network calls once it has loaded. - Out of scope: device photos, 3D shapes, AI backgrounds, video and animation, accounts, cloud storage. - README: how to add a frame or a preset, and an honest note that this covers still images only.
Opens your agent with the prompt filled in, you press enter. Or copy it and paste it into an empty folder.
Then keep going
Next prompts, same folder.
The first prompt builds the core. Run these one at a time in the same folder to grow it into your own Shots.so.
Add a zoom video export to the screenshot beautifier in this folder. Requirements: - Let me drag a rectangle on the framed image to mark the zoom target, and choose a duration of 2 to 6 seconds with an ease-in-out curve. - Render frames to a canvas at 30 fps and encode them with WebCodecs `VideoEncoder` (H.264), muxed into MP4 with `mp4-muxer`. - Show a progress bar and a preview before exporting; refuse to start when `VideoEncoder` is missing and say which browsers work. - Export sizes 1280x720 and 1080x1920. - Update the README with the measured export time for a 4-second clip.
Add annotations to the screenshot beautifier in this folder. Requirements: - Tools: arrow, rectangle, numbered badge, text, and a pixelate rectangle that destroys the pixels underneath rather than hiding them. - Select, move, resize, delete and undo/redo with Cmd or Ctrl+Z. - Annotations are part of the image before the frame and shadow are applied, and survive the batch export of the same preset only when turned on. - Test that pixels inside a pixelate rectangle cannot be recovered from the exported PNG. - Update the README.
Add screen capture to the screenshot beautifier in this folder. Requirements: - A Capture button calls `navigator.mediaDevices.getDisplayMedia`, grabs one frame at the stream's native resolution and loads it as the input; the stream stops straight away. - A crop step with drag handles and an aspect-ratio lock before styling. - Remember the last preset used for captures. - Say clearly in the UI when the browser refuses permission. - Update the README.
What you lose
- A library of real device mockups (iPhone, Android, iPad, desktop) with correct bezels
- 3D shapes, glass backgrounds and effects such as noise, VHS and glitch
- Magic backgrounds that are generated from the colours in your media
- Animation presets with zoom and parallax rendered as 2K video at 60 fps
- Transparent video, WebP and GIF export from the Pro plan
Why people still pay
Makers of landing pages, launch posts and app listings want a screenshot that looks designed within a minute, without opening Figma. Shots puts templates, devices and motion in one browser tab with nothing to install, and the paid tiers start to matter once you need video or a sharper export. A $10 month is easy to justify before a launch and easy to cancel after it.
Shots.so or your own copy?
Over
Your usage
3h ×$/h
Shots.so, 1 yr$120
Your own copy, 1 yr$5running + build session
You keep$115pays for itself in the first month
Estimate · Runs in your browser for nothing and needs no server. The build is token usage on your agent plan.
Take your data, then cancel.
1 · Take your data out of Shots.so
- 1There is no library to export: the upgrade sheet lists Drafts and Folders as coming soon, so what you made is the PNG, video and WebP files you already downloaded. Keep those.
- 2The terms say you own your content and grant Shots a licence to host and render it to run the service.
- 3You can ask for the account to be deleted; the privacy policy keeps data for 90 days after deletion, and tax records for 7 years.
2 · Cancel Shots.so
- 1Sign in and open your dashboard: the terms say you can cancel at any time from there.
- 2Cancellation takes effect at the end of the current billing cycle, so paid exports stay available until then.
- 3Refunds are not automatic: Shots decides case by case from your usage, when in the cycle you ask and why you cancel; approved refunds arrive within 7 to 10 days.
- Render the videos you need before the cycle ends: Plus allows 10 video exports and Pro is unlimited.
- The upgrade sheet says Plus and Pro, while the terms say Basic and Pro: check the plan name on your Stripe receipt before cancelling.
- The privacy policy names Vercel and Cloudflare R2 as hosting providers and says uploaded graphics and videos are collected for rendering, so use a local tool for screens with secrets.
- Shots can change prices with at least 30 days' notice.
The escape hatch
Don't feel like building it? These are already free.
ShotCandyOpen sourceMIT screenshot beautifier and mockup maker that runs in the browser: backgrounds, device frames, batch export and screen recordings, with no account, upload or watermark.★ 52 · active Oct 2026 · they host it
WebVisit ↗ShottrFreeMac screenshot tool with backdrops, annotations and scrolling capture; free to use with occasional prompts to buy a licence.one-click install
macOSVisit ↗
WebVisit ↗ShottrFreeMac screenshot tool with backdrops, annotations and scrolling capture; free to use with occasional prompts to buy a licence.one-click install
macOSVisit ↗
The numbers
Shots.so pricing
| Plan | Monthly | Annual, per month | What you get |
|---|---|---|---|
| Free | $0 | $0 | Mockups with the frame, style and background tools and PNG export; the export button starts at 1x. |
| Plus | $10 | $7.92 | 4K images (2x), animation and zoom at 30 fps with parallax effects, 720p video at 30 fps with 10 exports of up to 1 minute each. |
| Pro | $15 | $10.42 | Up to 6K images (3x), 2K video at 60 fps with unlimited exports of up to 3 minutes, transparent video (WebM, 1080p, up to 20 seconds) and WebP export. |
- Free tier
- PNG images only: video, 4K and 6K output, transparent video and WebP sit behind a plan.
- Billing
- Monthly or yearly through Stripe. There is no public pricing page: the prices are in the app's upgrade sheet, which opens from the menu in the editor without an account. Paid plans renew automatically until you cancel, and cancelling takes effect at the end of the billing cycle. The terms say prices can change with at least 30 days' notice and name the plans Free, Basic and Pro, where the sheet says Plus and Pro.
- Hidden costs
- Sales and local-currency prices change what the sheet shows. Plus caps video at 10 exports, so anyone who makes video often ends up on Pro at $15.
- Source
- shots.so
Also on the list
Related apps
Free lets you build mockups with the style, frame and background tools and export PNG images; video, 4K and 6K output and WebP need a plan.
Yes. An AI coding agent such as Claude Code, Codex or Cursor can build a usable personal version in one session with the prompt on this page, running on your own machine.
About $10 a month on the Plus plan, $120 a year (checked 2026-10-19).
A library of real device mockups (iPhone, Android, iPad, desktop) with correct bezels; 3D shapes, glass backgrounds and effects such as noise, VHS and glitch; Magic backgrounds that are generated from the colours in your media; Animation presets with zoom and parallax rendered as 2K video at 60 fps; Transparent video, WebP and GIF export from the Pro plan. If any of those matter to you, keep paying.
Yes: ShotCandy (open source), Shottr (free).