Image ↔ Base64 converts image files (PNG, JPG, SVG, WebP, GIF) to Base64-encoded data URIs and back. Drag, paste, or click to load an image; copy the full data:image/...;base64,... string to embed inline in CSS, HTML, or config. Or paste a data URI to preview and download it as an image file.
Base64-encoded images can be embedded directly into CSS, HTML, or config files — useful for small icons, email templates, or build artifacts where external image requests are undesirable. This tool makes the conversion effortless. Drag an image file, paste from clipboard, or click to browse. The tool converts it to a data URI with the correct MIME type (data:image/png;base64,..., data:image/svg+xml;base64,..., etc.). The opposite direction also works — paste a data URI and the tool renders the image for preview and offers a download link to save it as a real file. Works entirely in-browser, no uploads — your images never leave your machine. Handles PNG, JPG/JPEG, SVG, WebP, GIF, and ICO formats.
Multiple ways to load an image: drag a file from your OS, paste from clipboard (screenshots work), or click to open a file picker.
When you paste a data URI, the tool renders the image immediately so you can verify it before copying or downloading.
Copies the complete data:image/...;base64,... string ready to paste into your CSS, HTML src attribute, or JSON config.
No upload wait — everything happens locally. Even large images convert in a fraction of a second.
From a Base64 data URI, save the decoded image as an actual file (PNG, JPG, SVG, etc.) with the correct extension.
Supports PNG, JPG, SVG, WebP, GIF, and ICO. MIME type is detected automatically so your data URI is always correct.
Convert a 16×16 icon to Base64 and inline it in background-image: url(...). No HTTP request, no cache miss — the icon ships with your CSS.
Embed images directly in HTML emails as data URIs when external image references get blocked by clients or marked as spam.
Include small images in webpack/vite bundle output to eliminate asset round-trips during app startup.
Paste a data URI from dev tools, HTML source, or a CSS file to preview and download the underlying image as a file.
When an embedded image doesn't render, paste the data URI into the decoder to verify the Base64 is valid and the MIME type is correct.
Click the Image Base64 icon in the DevSuite Pro dock. A two-pane panel opens with a drop zone and a data URI field.
Drag a file onto the drop zone, paste an image from clipboard (Ctrl+V), or click the zone to browse. A preview appears.
The Base64 data URI is generated immediately in the output field — click Copy to send it to your clipboard, ready to paste inline.
To go Base64 → image, paste a data URI into the field. The preview renders the image and a Download button appears.
Save the reconstructed image as a real file, or copy the data URI to share or embed somewhere else.
Paigaldage DevSuite Pro tasuta ja avage 39+ arendustööriista oma brauserile.
