Image to Base64
Turn an image into a data URL (data:image/…;base64,…) that you can paste straight into HTML, CSS, or JSON.
Your input stays in your browser. Nothing is uploaded.
About this tool
The original file bytes are read and encoded as Base64, without re-compressing the image, so the result decodes to an identical file. Base64 is about 33% larger than the binary file, and inline images cannot be cached separately by the browser, so data URLs work best for small icons and placeholders rather than photos.
How to use it
- Choose an image.
- Copy the data URL.
- Paste it into an img src attribute or a CSS url().
Data URL size ≈ file size × 4 ÷ 3
Examples
HTML
<img src="data:image/png;base64,iVBORw0KGgo…" alt="…">
CSS
background-image: url("data:image/svg+xml;base64,…");
Size check
A 30 KB icon becomes about 40 KB of text.
FAQ
Is the image re-compressed?
No. The file is encoded byte for byte, so quality and metadata are unchanged.
When should I avoid data URLs?
For large images, or images used on many pages. A normal file can be cached once and reused.
Is my image uploaded?
No. Encoding happens in your browser.