A Base64 image string that "just won't show up" almost always comes down to one of a small handful of issues. Here's how to work through them.
Missing the Data URI Prefix
If you're pasting a raw Base64 string directly into an <img src> or CSS url() without the data:image/png;base64, (or matching MIME type) prefix, the browser has no way to know it's looking at an image at all. This is the single most common cause of "nothing renders."
// Won't work -- missing prefix
<img src="iVBORw0KGgoAAAANSUhEUgAA...">
// Works -- includes the data URI prefix
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...">
Wrong or Mismatched MIME Type
The prefix needs to match the actual image format — image/png for a PNG, image/jpeg for a JPEG, image/svg+xml for an SVG, and so on. A PNG's encoded data labeled as image/jpeg may fail to render correctly, since the browser is being told to expect a different format than what's actually encoded.
A Truncated or Incomplete String
If the Base64 text was cut short somewhere along the way — a copy-paste that got interrupted, a text field with a character limit, a log file that truncates long lines — decoding will fail partway through or produce a corrupted, partial image. Compare the length of what you have against what you originally generated, if you still have access to that, to check for truncation.
Stray Whitespace or Line Breaks
Some tools or text editors wrap long lines automatically, inserting line breaks into what should be one continuous string. Depending on how strictly a particular decoder handles whitespace, this can break decoding. Removing any accidental line breaks or extra spaces before decoding resolves this.
Have a Base64 string that won't decode? Try it here.
Open Base64 Image Converter