Base64 to Image

How do you turn a Base64 string into a downloadable image?

Paste the encoded image into Base64 String and click Convert to Image. The result panel shows an image preview, decoded file size, and MIME type. Select Download Image to save the bytes. Pasting alone does not start conversion, and changing the text does not update an existing preview until you convert again.

For a reproducible example, paste this complete data URI. It contains a one-pixel GIF with a transparent pixel, so the preview may look empty. The encoded payload has 56 characters and decodes to 42 bytes. The metadata line displays 0.0 KB · image/gif because it rounds 42 ÷ 1024 to one decimal place. The download button shows 42 B, and the filename is decoded-image.gif.

data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7

Keep the prefix when testing this example. Removing it leaves the same encoded bytes, but the tool assigns raw input the default MIME type image/png and chooses a PNG filename. This illustrates why a filename alone is not proof of the actual file format.

What does Base64 decoding actually change?

Base64 is a text representation of binary data, defined by RFC 4648. Its standard alphabet uses letters, digits, +, and /, with = for padding. Three input bytes become four encoded characters; a final partial group uses padding. For a padded payload, encoded length is 4 × ceil(byte count ÷ 3), excluding any data URI prefix.

Decoding reverses that representation rather than processing pixels. This tool calls atob(), copies the resulting binary string into a Uint8Array, and creates a Blob. It does not use a canvas or image encoder. Existing compression, transparency, and embedded metadata remain in the decoded bytes. It cannot restore details already lost before encoding or repair a damaged source image.

How does the tool parse a data URI?

RFC 2397 defines data URLs that carry content inline. This decoder accepts a specific Base64 form: data:<mime-type>;base64,<payload>. The prefix supplies the Blob's MIME type; everything after the comma is decoded. Use the original type, such as image/jpeg, rather than choosing a prefix to request a different output format.

Input handling in this decoder

Input	Handling
Raw Base64	Decoded with image/png as the default type
Base64 image data URI	Uses the MIME type written in the prefix
Whitespace or line breaks in the payload	Removed before decoding
Percent-encoded data or plain SVG markup	Not decoded as an alternative input format

The parser expects lowercase data: and ;base64,. It does not handle extra parameters such as ;charset=utf-8 between the MIME type and Base64 marker, or a data URI with the MIME type omitted. Preserve the simple prefix structure and paste the payload itself rather than an entire HTML tag, CSS declaration, or JSON object.

Which formats determine the download extension?

The filename starts with decoded-image. The extension map uses png for image/png, jpg for image/jpeg, webp for image/webp, gif for image/gif, svg for image/svg+xml, and avif for image/avif. Any MIME type outside that map falls back to png; this fallback does not convert the file.

There is no format selector or signature detection. A recognized extension also does not guarantee a working preview: the bytes must contain a valid image that your browser supports. The preview is constrained to a maximum height of 400 CSS pixels, which affects its display rather than the download. Pixel dimensions are not listed in the result panel.

What should you check when the image looks corrupted?

First distinguish a decoding error from a rendering problem. Text rejected by atob() produces the message “Invalid Base64 string. Check for typos or missing characters.” A decodable payload can still contain ordinary text, truncated image bytes, or the wrong content. The image element has no custom load-error handler, so a broken preview does not necessarily trigger a separate error message.

Spaces and real line breaks are removed automatically. Literal backslash escapes copied from JSON are different: parse or unescape the JSON value before pasting. This decoder does not percent-decode %2B or %2F, and it does not normalize the - and _ alphabet used by Base64url. Obtain standard Base64 from the source rather than replacing arbitrary characters.

Compare the complete payload with its source when truncation is possible. Missing trailing padding is not automatically evidence of corruption: the browser accepts some unpadded inputs. Missing image data is a separate problem that decoding cannot fix. For general text decoding rather than image preview, use Base64 Encode / Decode.

How does downloading work without a server?

The conversion path runs in the browser without uploading the entered text. A temporary blob: object URL supplies the preview from the decoded Blob. Download Image creates another object URL and triggers an anchor download with the selected filename, then revokes that download URL. Clear resets the input, error, and result and revokes the current preview URL.

No size cap is configured, but browser memory and rendering capacity remain practical limits. Decoding is synchronous, and several representations of the data coexist, so there is no fixed memory multiplier or guaranteed completion time. If Paste does nothing because clipboard access is denied, paste directly into Base64 String with your keyboard or device's paste command.

When is decoding an embedded image useful?

Use this workflow to inspect an encoded image field from an API response, extract a data URI from an HTML email, or recover an inline CSS asset. Copy only the field value or URI, leaving out surrounding quotes, url(), and markup. An ordinary remote image URL is not a Base64 payload; this tool does not fetch that URL for you.

To create an encoded string from a file instead, use Image to Base64. If the recovered image is too large for its next use, process the downloaded file separately with Image Compressor. Decoding here preserves the original bytes rather than optimizing the image.