Image to Data URI converter
Output data URI code:
Online image to Data URI conversion tool
Data URI is a method for embedding small images directly in your HTML or CSS code using base64 encoding without the need for additional image files. It's useful when you want to improve performance by reducing the number of HTTP requests needed to load a webpage or when you want to distribute a script/HTML page with some icons or other small images but prefer to keep it in a single file, or include images in email signatures.
They can be used both in HTML, where the image data is placed inside the src attribute or in a CSS file as a background image. This tool lets you select one of both ways or just a raw data URI string without the additional code.
All major browsers currently support data URI in a CSS background property.
Data URI in a HTML image src property is not supported by Internet Explorer.
Please keep in mind it's usually not useful to embed anything larger than few kilobytes, as it will likely impact performance negatively because these images won't be cached by the browser if used in HTML and will increase CSS parsing time if used in CSS. If you have many small icons, consider using CSS sprites instead. But we won't set any hard limits for this tool; it's your call.