opennookorg/screenshot-studio

TypeScriptscreenshot-studio.com

开源替代 CleanShot X

A free, browser-based editor for creating stunning screenshots and visuals. No signup, no watermarks.

blobblob-storagecanvasnextjsshadcn-uishowcasetypescriptossvercelvercel-oss
Star 增长趋势
Star
1.1k
Forks
162
周增长
+12
Issues
1
4006008001k
25年11月26年2月26年6月26年10月
制品库npm
README

Screenshot Studio

Vercel OSS Program

Screenshot Studio editor preview

A free, open-source editor for screenshots, mockups, and social graphics. No signup or watermarks.

Open the editor · Image tools · Code to image · App Store screenshots

What you can make

  • Screenshot designs: backgrounds, browser and device frames, shadows, and 3D perspective.
  • Text-only graphics: start without an image; choose Inter, Geist, or other fonts, then drag or center your text.
  • Layered compositions: text, images, annotations, and blur regions.
  • Store and social assets: ready-made layouts and exact export sizes, including Chrome Web Store screenshots.
  • Images and motion: PNG, JPEG, WebP, batch ZIP, MP4, WebM, and GIF exports.
  • Quick edits: resize, crop, convert, compress, and remove image backgrounds.

Run locally

Requires Node.js 20.9+ and npm.

git clone https://github.com/opennookorg/screenshot-studio.git
cd screenshot-studio
npm ci
printf 'DATABASE_URL="postgresql://localhost:5432/screenshot_studio"\n' > .env
npm run dev

Open localhost:3000. The browser editor needs no running database; DATABASE_URL is required by Prisma during startup and builds. Server-side screenshot caching requires PostgreSQL and R2 credentials; see the cache configuration.

Contribute

Read CONTRIBUTING.md for the workflow and checks. Built with Next.js, React, TypeScript, Tailwind CSS, and Zustand.

Apache 2.0 license · Supported by the Vercel OSS Program