Blurhash
Generates a base64 WebP placeholder for image uploads in Payload CMS.
Installation
pnpm add @nlvogel/payload-blurhash About
The payload-blurhash plugin allows Payload CMS to automatically create a tiny base64 WebP placeholder, or 'blurhash', during image uploads. This placeholder serves as an instant blurred preview while the full image loads, useful for enhancing user experience. It integrates seamlessly with upload collections, storing the blurhash directly on the upload document without requiring additional requests from the frontend. The plugin adds specific fields for each targeted upload collection, including a read-only `blurhash`, horizontal and vertical resolution components, and a UI component for previewing and regenerating the blurhash. Users can configure settings such as collection limits and default resolution values during initialization. Additionally, a regeneration endpoint is available for manual updates when necessary, ensuring flexibility in managing image uploads. Compatibility includes Payload version 3.0.0 or higher, and it requires Node.js and React within specified versions. It can be integrated easily into existing Payload projects to improve image handling processes.
Package info
- Package name
@nlvogel/payload-blurhash- Latest version
0.1.0- Unpacked size
- 44 kB
- License
- MIT
- Weekly downloads
- 1
- Last publish
- Apr 29, 2026
More from nick-vogel
View profileSimilar plugins
More in MediaMedia Preview
Preview images, videos, audio, and documents directly in the Payload CMS admin panel.
Decks
Adds reusable deck blocks with slide capabilities to Payload CMS.
CypherScan
Scans Payload upload collections for malware and secrets via the CypherScan API and blocks suspicious files before they persist.
Aspect Preview
Inline crop, focal point, and live multi-aspect-ratio preview editor for Payload upload collections.
Media Search
Integrates stock image and video search into Payload CMS admin.
Base64 image placeholder
Generates a base64-encoded placeholder image for Payload upload collections and stores it in a text field.