Image to Base64
Turn an image into a data URI you can paste straight into a stylesheet or a template — handy for small icons where an extra HTTP request costs more than the bytes.
Drop an image here
or , or press ⌘V to paste
Small icons and logos are the sensible candidates. Anything large gets worse, not better, as a data URI.
Processed on your device. Nothing is uploaded.
How to use it
- Drop the image in.
- Copy the data URI, or the ready-made HTML or CSS snippet.
Questions
Are my images uploaded anywhere?
No. Everything runs in your browser using the Canvas API — the file never leaves your machine, and the tool keeps working if you go offline after the page loads. There is no account, no queue, and no server-side copy to delete later.
When is inlining an image actually a good idea?
For small assets — icons, sprites, a tiny placeholder — where saving a network round trip beats the size penalty. Base64 inflates the payload by about 33% and cannot be cached separately from the document, so it is the wrong choice for anything large or reused across pages.
Related tools
- Base64 to imagePaste a Base64 string or data URI and download it as an image file. Decoded in your browser, never uploaded.
- Image compressorShrink JPG, PNG and WebP files with a live quality preview and a before/after size readout. Nothing is uploaded.
- Image format converterConvert between PNG, JPG and WebP in your browser. Batch conversion with quality control, no uploads, no sign-up.
This is one keystroke inside LayerShot
The desktop app captures the screen, applies your styling and puts the result on your clipboard without a browser tab, an upload, or a download folder full of files called Screenshot (3).png. One payment, one Mac and one Windows PC, lifetime updates.