An Astro integration for generating screenshots of your pages automatically at build time
Generate screenshots of your Astro pages automatically at build time with Astro Snapshot. Perfect for creating social images, content previews, dynamic icons, and more!
This integration was inspired by astro-selfie and a similar plugin I wrote for Gatsby called Gatsby Plugin: Component to Image. Compared to astro-selfie, this integration exposes a lot more configuration options which allow you to completely customize how images are generated.
- 🧩 Framework agnostic: Generate images from any valid Astro page
- Unlike other integrations for generating social images, not limited to preset layouts
- Unlike Satori, not limited to certain types of JSX elements or CSS properties
- Use whatever front-end framework you want
- 📸 Customizable outputs: Full control over the generated images
- Generate multiple images per page with different configurations
- Save images to
public,dist,src, or any other directory - Save PNG, JPEG, or WebP images, with the format automatically detected from the output filename
- Save images at any resolution
- Choose whether to overwrite existing images or skip them
- ⚙️ Flexible configuration: Advanced options for power users
- Define global defaults to keep configs minimal and override them on a per-image basis
- Pass through options directly to Puppeteer for precise control of the browser, viewport, and screenshot generation process
- 🔧 TypeScript support: Full type safety for all options and functions
- Import types from the package to make sure your config is correct
- Install the package from JSR for use with TypeScript-native runtimes like Deno
- 🏞️ Social images: Use your existing front-end components to generate Open Graph images and/or Twitter cards for your blog posts or other content
- 📰 Content previews: Generate screenshots of your website for use in documentation, marketing materials, showcases, etc.
- 🖼️ Favicons: Dynamically generate favicons for your website
For installation and usage instructions, see the docs.
Need help? Refer to the troubleshooting page in the docs for a list of common issues and their solutions.
See the support resources for information on how to:
- request features
- report bugs
- ask questions
- report security vulnerabilities
Want to help out? Pull requests are welcome for:
- feature implementations
- bug fixes
- documentation
- tests
See the contribution guide for more details.
Copyright © 2026 John Goodliff (@twocaretcat).
This project is licensed under the MIT license. See the license for more details.
We are not affiliated with or endorsed by Astro.
See the related projects page in the docs a list of similar projects you might like.
Find this project useful? Sponsoring me will help me cover costs and commit more time to open-source.
If you can't donate but still want to contribute, don't worry. There are many other ways to help out, like:
- 📢 reporting (submitting feature requests & bug reports)
- 👨💻 coding (implementing features & fixing bugs)
- 📝 writing (documenting & translating)
- 💬 spreading the word
- ⭐ starring the project
Thanks for the support!
