Image to Data URI converter

Select image



Supported image types: GIF (including animated), JPG, PNG
Max file size: 20MB

You can also use: http://ezgif.com/image-to-datauri?url=http://link/to/image.gif

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 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.

They can be used both in HTML, where the image data is placed inside src attribute, or in a CSS file, as a background image. This tool lets you select one of both ways or just gives you a raw data URI string without the additional code.

Data URI in a CSS background property is currently supported by all major browsers and safe to use, unless you care about IE7 and older, and it that case you can add fallback background image property with path to ordinary image file for IE.
Data URI in a HTML image src property is not supported by IE/Edge.

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 in 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.