Huzaifa Awais

Image to Base64 Data URI

Convert an image file into a Base64 data URI, CSS background rule or HTML img tag for embedding small icons directly in code.

Runs on your device

    Results appear here after you select “Convert”.

    What it does

    Embedding tiny icons as data URIs saves an HTTP request. The tool verifies the file really is an image and warns when the result is too large to be worth inlining.

    How to use it

    1. Choose a small image (ideally under 10 KB).
    2. Pick the output format.
    3. Copy the snippet into your code.

    Example

    The example generates a small sample file in your browser and runs the tool on it. Select Try an example above to see it.

    When it helps

    • Inline icons in HTML emails.
    • Single file HTML prototypes.
    • CSS sprites replacement for tiny assets.

    Questions

    Why does the data URI get bigger than the file?

    Base64 adds about 33% overhead. Inline only small images; serve large ones as normal files.

    Are SVG files supported?

    This tool accepts raster formats. For SVG, URL-encoding is usually smaller than Base64.

    More image tools

    See all 12

    People also use

    Browse all 200 tools