Stayput

↑↓ to move, Enter to open, Esc to close. Search runs on this page. Nothing you type is sent.

Convert image to Base64

Get the data URI, the raw Base64 and ready-made HTML and CSS for any image, with the size it adds. Your image never leaves this tab.

Encodes PNG, JPG, WebP, GIF, SVG, AVIF and ICO images as Base64 and gives you the data URI, HTML and CSS snippets, with the size the encoding adds. It is free, needs no account and adds no watermark, and your files are not uploaded: everything runs in your browser on your device. The size limit is your device’s memory, and phones hold less; give the page a short while after one visit to save itself for offline use, and then it works offline.

Drop images to encode as Base64or click to choose files. Batches welcome.
    Details

    Each image is encoded exactly as it is, with no re-compression, so the Base64 decodes back to the identical file. Base64 text is about a third larger than the image, which suits small icons and logos; large images are better kept as files.

    Working…

    Done

    Free, no ads. Support StayPut

    Your files are processed on this device and never sent to a server. Reload the page to clear everything from memory.

    How it works

    1. Drop one or more images (PNG, JPG, WebP, GIF, SVG, AVIF or ICO), or tap to pick them.
    2. Encode. Each image gets its data URI, the raw Base64, an HTML img tag and a CSS background-image rule.
    3. Press Copy next to the one you need, or download the data URI as a .txt file.

    In your browser, not on a server

    Your browser reads each file’s bytes with its own FileReader and writes them out as Base64 text. Nothing is decoded or re-encoded, so the Base64 is exactly the file you dropped. The data URI is that text with a data:image/…;base64, header in front, and the HTML and CSS snippets are plain strings built around it in your tab.

    Compared with upload-based tools: Online Base64 encoders send the image to a server to encode it, and the images people encode are often logos for unreleased products or screenshots with private details. Here the encoding is a built-in browser call on your device, so the image never goes anywhere.

    Verify it yourself. Give the page a short while after one visit to save itself for offline use, then turn off Wi-Fi or switch to airplane mode and run the tool again. Or open your browser's developer tools (F12, or Cmd-Option-I on a Mac), pick the Network tab, and watch it while you convert. The panel above does the same count for you.

    Questions

    What is the difference between the data URI and the Base64?

    The Base64 is the file’s bytes written as text. The data URI is that text with a prefix such as data:image/png;base64, in front, which is what a browser needs to show it from an img src or a CSS url(). Use the data URI for HTML and CSS, and the raw Base64 for an API field or JSON that wants only the encoded bytes.

    Why is the Base64 bigger than my image?

    Base64 writes three bytes as four characters, so the text is about 33% larger than the file. An image over about 1 MB is better linked as a file than embedded: a data URI makes the page itself heavier and cannot be cached separately. The result card shows both sizes, and warns above 1 MB.

    Which images should I embed as a data URI?

    Small ones: icons, logos and tiny backgrounds of a few kilobytes, where saving a request is worth more than the extra third. Photos are better as files. If an image is large, shrink it first with Compress image or change its format with Convert image.

    Can I encode an SVG?

    Yes. The SVG file is encoded as it is. For an SVG you could also paste its markup straight into the page, which is smaller. To turn a raster picture into a vector first, use Image to SVG.

    Can I make a favicon this way?

    A data URI works in a link tag, but browsers cache a real file better and some ignore data URIs for icons. Favicon generator writes the whole icon set and the HTML for it.

    Is my image uploaded?

    No. The file is read by your browser’s FileReader and encoded in this tab. There is no server in the process, and after one visit and a short wait the page works offline.

    More image tools

    RAW preview extractor

    Extract the JPEG preview from a RAW file: the picture your camera already saved inside it, copied out unchanged. This is not a RAW develop, and the file never leaves this tab.

    Favicon generator

    Drop in your logo and get every icon a website needs, plus the HTML to paste. Unreleased logos stay on this device.

    Remove background

    Cut out people, pets and products at full resolution. The photo never leaves this device.

    Passport photo maker

    Crop a photo to passport size with the head at the right height, and get a sheet to print at any photo counter.

    Popular conversions