Image to Base64 Converter
Convert an image to a Base64 data URI for embedding in HTML or CSS.
A Base64 data URI turns an image into a text string you can paste directly into HTML, CSS or JSON — no separate file, no extra network request. It's handy for tiny icons, email templates that can't reference external images, single-file demos, and inlining assets to avoid an extra round-trip.
Drop in an image and this tool encodes it as a complete data: URI, ready to paste into an <img src> or CSS background. It also shows the encoded size, since Base64 adds about 33% overhead — useful for deciding whether inlining is worth it. Everything happens in your browser.
How to use Image to Base64 Converter
- 1
Upload an image
PNG, JPG, WebP, GIF or SVG.
- 2
Copy the data URI
A complete data: URL ready to paste.
- 3
Embed it
Use in <img src>, CSS url(), or JSON.
Features
- Complete data: URI output
- Shows encoded size overhead
- Supports common image formats including SVG
Frequently asked questions
Common mistakes to avoid
- Inlining large images, bloating your HTML/CSS and defeating browser caching.
- Forgetting the data: prefix — the full URI (including data:image/png;base64,) is required.
Get new tools in your inbox
One email a month with new tools, guides, and updates. No spam, unsubscribe anytime.