Full-page screenshot studio. Capture a webpage from top to bottom — the entire scroll, not just the viewport — then download it.
This is a working product, not a mock: a studio with long demo pages, a live URL engine, and a Chrome/Edge extension that adds Capture entire page to the right-click menu.
- Studio capture — load Essay, Docs, or Lookbook and press Capture entire page. You get a full-height JPEG of the whole document.
- Live URL — paste a public URL. Playwright opens the page headless and screenshots
fullPage. - Right-click menu — in the studio, right-click the page for entire page or visible area.
- Chrome extension — same command on any site you visit. Load
public/extensionunpacked, or download the zip from/extension. - Shots — captures stay in local history so you can reopen, copy, or download later.
React 19 · TypeScript · TanStack Start · Tailwind v4 · Playwright · html-to-image · Chrome MV3
Studio pages fall back to client-side capture if the headless browser isn’t available. Live URLs are SSRF-checked (public HTTP(S) only; loopback is allowed for the local demo routes).
npm install
npx playwright install chromium
npm run devOpen the URL Vite prints (default port 8080).
npm run typecheck
npm run buildLive URL capture needs Chromium. Without it, studio pages still capture in the browser.
- Open
chrome://extensions - Enable Developer mode
- Load unpacked →
public/extension
Right-click any page → Capture entire page. The editor opens with the stitched strip so you can copy or download.
A packed zip ships at public/scrollshot-extension.zip.
src/components/studio/ studio UI, context menu, result viewer
src/components/demos/ long-form sample pages
src/lib/capture/ client capture, Playwright engine, SSRF
src/routes/ studio, extension, shots, demo pages
public/extension/ Chrome MV3 extension
MIT