Image Tools
PDF Tools
Developer ToolsBase64 Images in HTML, CSS and JSON: Best Practices
Inline images can speed up a page or slow it down. Here are clear rules for when Base64 is the right tool.
Got a long Base64 text from an API or a database and want to see the picture? Paste it and download the image in seconds.
Developers often meet Base64 in API responses, logs or database fields. A long wall of letters is not helpful until you can see what it contains.
Steps
- Open the Base64 Image Converter.
- Choose Base64 to Image.
- Paste the Base64 text or the full data URL.
- Press Decode image.
- Check the preview and press Download image.
Accepted input
- A full data URL, such as
data:image/png;base64,.... - A raw Base64 string without the prefix.
If it does not work
- Extra characters: remove quotes, spaces or line breaks that were copied by mistake.
- Cut text: a string that was truncated by a log viewer cannot be decoded. Copy the full value.
- Not an image: some Base64 strings are PDFs or other files, not pictures.
- URL safe variants: strings that use
-and_instead of+and/may need those characters swapped back.
Privacy
Decoding happens in your browser, so a private image such as a signature or an ID scan is not uploaded.
To go the other way, see what Base64 image encoding is.
Try it now: Base64 Image Encoder / Decoder
Encode an image to Base64 text, or decode it back to a file.
Open Base64 Image Encoder / Decoder