Back to tools

Image to Base64

Convert images to Base64 encoding for embedding in code

Drag & drop an image here or

Output Options

Why Use Base64 Images?

Base64 encoding allows you to embed images directly into HTML, CSS, or JavaScript files without requiring additional HTTP requests. This can be useful for:

  • Small icons and UI elements
  • Reducing HTTP requests for better performance
  • Embedding images in single-file applications
  • Including images in JSON data

Usage Examples

HTML
CSS
JavaScript
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." alt="Image description">
.element {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...');
    background-repeat: no-repeat;
    background-position: center;
}
const img = new Image();
img.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...';
document.body.appendChild(img);
Notification message