← Back to Tools

🖼️ Base64 Image Encoder / Decoder

Encode an image to a Base64 data URI for embedding in HTML/CSS/JSON, or decode a Base64 string back to a viewable image. Nothing leaves your browser.

🖼️

Drop an image here or click to browse

PNG, JPEG, GIF, WebP, SVG — any size

How to use this tool

1 Upload an image file using the file picker.
2 The tool converts it to a Base64 data URI immediately.
3 Copy the data URI to embed the image directly in HTML or CSS without a separate file request.
4 Or paste an existing data URI to decode it back to a downloadable image file.

Frequently asked questions

When should I embed images as Base64?

For small icons or images used in emails, where external URL references may be blocked. For large images, use external files -- Base64 increases file size by about 33%.

Does Base64 compression affect image quality?

No. Base64 is an encoding format, not a compression format. It encodes the exact binary content of the image; image quality is unchanged.

Can I use Base64 images in CSS?

Yes. Use background-image: url('data:image/png;base64,...') in your CSS to embed an image directly without an external file.

What file types can be encoded?

Any binary file can be Base64 encoded. PNG, JPG, GIF, SVG, and WebP are the most common for web use.