What Base64 encoding does
Base64 turns binary data into plain text made of 64 safe characters: A to Z, a to z, 0 to 9, plus and slash. Every 3 bytes of the image become 4 characters, so the encoded text is about a third larger than the file. The panel under the preview shows the original size, the encoded size and the overhead as a percentage.
The encoding is done by your browser using the file you select. Nothing is sent to a server, which makes it suitable for internal screenshots and other images you would rather not upload.
Choosing an output format
Base64 gives the bare string, which is what most APIs and JSON fields expect. Data URI adds the data:image/...;base64, prefix so the string can be used directly as an image address. CSS wraps it in a background-image rule, and HTML wraps it in an img tag with an empty alt attribute for you to fill in.
Use Copy to put the result on your clipboard or Download .txt to save it; the file is named after the output you chose, such as photo-data-uri.txt or photo-css.txt. Very long outputs are cut short in the preview box only; Copy and Download always give the complete text.
When embedding an image as Base64 makes sense
Base64 is handy for small icons and logos inside a single HTML file, for sending an image through an API that only accepts JSON, for test fixtures and for storing small images in a text field. It is a poor fit for large photos: the text is bigger than the file, it can't be cached separately by the browser, and it bloats every page or document that contains it. Many email clients also block images embedded this way, so test before relying on it in a newsletter.