Skip to main content
Image / SVG Developer Tools

BlurHash Generator

Generate a BlurHash string from an image - a compact placeholder representation that renders as a smooth blurred preview while the real image loads.

Upload an image - this tool encodes it into a compact BlurHash string, and shows a decoded preview so you can see exactly what it looks like.

Your image is processed entirely in your browser and never uploaded anywhere. More components capture more detail but produce a longer hash string.

BlurHash is most useful for progressive image loading UI - showing the decoded blur while the real image downloads, then swapping it in once ready.

What Is BlurHash?

BlurHash is a compact string representation of a blurred, low-detail version of an image - short enough to embed directly in an API response or database field, then decoded client-side into a smooth placeholder while the real image loads.

Why Use This Tool?

Computing a BlurHash requires running its specific DCT-based encoding algorithm against the image's pixel data - this tool does that entirely in your browser and shows the decoded result so you can verify it looks right before using it.

How to Use It

  1. Upload an image.
  2. Choose the number of X/Y components (more components capture more detail, but produce a longer string).
  3. Copy the generated BlurHash string, and compare it against the decoded preview.

Limitations

BlurHash intentionally discards fine detail - it is a blurred approximation, not a compressed thumbnail. Displaying it in your app requires a BlurHash decoder library on the consuming side (widely available for most platforms/languages) to turn the string back into a rendered blur.

Share this tool: