Base64 Image Encoder
Turn images into Base64 strings and data URIs for HTML and CSS — with optional compression, resizing, and format conversion. Everything runs in your browser; no file is uploaded.
Drag & drop your images here
Base64 / data URI — any format
Also compress / resize / convert
† caveats apply — GIF keeps only the first frame, SVG is rasterised, AVIF can be read but not written. TIFF and HEIC can't be decoded by most browsers, so they encode to Base64 unchanged but can't be processed.
Up to 20 files · 1 MB each · nothing leaves your device
{{ qualityNote }}
Results
All conversion happens in your browser. Your images are never uploaded to a server.
About Base64 images and data URIs
A data URI embeds an image directly into your HTML or CSS as text, so the browser doesn't make a separate request for it. Base64 uses four characters for every three bytes, which makes the embedded version roughly 33% larger than the original file.
Use data URIs for small assets only
Below about 5 KB — icons, tiny textures, spacers — embedding usually wins. Above that the tradeoff turns against you: a data URI can't be cached separately from the page that contains it, it inflates every page that embeds it, and a large one inside CSS delays first render because the stylesheet has to finish parsing first.
Data URIs do not work in most email clients
Gmail strips data: image sources, and Outlook's Word-based rendering engine doesn't
support them. Apple Mail does. For HTML email, use CID attachments or hosted image URLs instead —
despite what many Base64 tools claim, this is close to the worst option for email.
Processing strips metadata
Encoding with no options selected reproduces your file byte-for-byte. Turning on compress, resize, or convert re-encodes through a canvas, which removes EXIF data — including GPS coordinates, usually a privacy win, but also colour profiles and copyright fields.
Just need a smaller file, not a data URI?
Use the Advanced Image Compressor — it handles multiple files at once and shows a live before/after comparison before you download anything.
Encoding plain text instead?
Use the Base64 text encoder and decoder.
Frequently asked questions
What is a data URI?
A data URI embeds a file directly in your HTML or CSS as text, so the browser does not make a separate network request for it. It looks like data:image/png;base64, followed by the encoded bytes.
When should I use a Base64 image instead of a file?
Only for small assets, roughly under 5 KB — icons, tiny textures, spacers. Larger data URIs cannot be cached separately from the page, inflate every page that embeds them by about 33%, and delay first render when placed in CSS.
Do Base64 images work in email?
Mostly no. Gmail strips data: image sources and Outlook's Word-based renderer does not support them. Apple Mail does. For HTML email use CID attachments or hosted image URLs instead.
Why can't I resize or compress my HEIC or TIFF file?
Compressing, resizing and converting require the browser to decode the image, and most browsers cannot decode HEIC or TIFF. Those formats still encode to Base64 unchanged — just leave the three option cards unticked.
Does processing remove my photo's location data?
Yes. Turning on compress, resize or convert re-encodes the image through a canvas, which strips EXIF metadata including GPS coordinates. Encoding with no options selected preserves the original bytes exactly, EXIF included.