Image to data uri converter
World's simplest image toolFree online image to Data URI converter. Just drag and drop your image here and it will be automatically converted to a Data URL. This enables you to easily include the image directly in your web page or share it as a self-contained code snippet. Created by engineers from team Browserling.
A link to this tool, including input, options and all chained tools.
Click here to select an image from your device, press Ctrl+V to use an image from your clipboard, drag and drop a file from desktop, or load an image from any example below.
Release your mouse to import this file.
Your file is being imported...
Can't convert.
What is a image to data uri converter?
learn more about this toolThis tool converts images to Data URI (Uniform Resource Identifier) encoding scheme. It simplifies the embedding of images directly into HTML or CSS code without the need for separate image files. The program first encodes the image data into base64 and then generates a data URI using the following format: "data:[MIME-type];base64,[encoded-image-data]". The "MIME-type" represents the image file type, such as "image/jpeg" or "image/png". "Base64" denotes the encoding scheme used. The encoded image data is inserted in place of "[encoded-image-data]" in the data URI. Image-abulous!
Image to data uri converter examples
Click to useConvert a JPG Image to a Data URL
This example converts an image of wheat plants into a textual Data URI encoding. Since the input image is in JPEG format, the [MIME-type] in the block is specified as "image/jpeg". (Source: Pexels.)
![This example converts an image of wheat plants into a textual Data URI encoding. Since the input image is in JPEG format, the [MIME-type] in the block is specified as "image/jpeg". (Source: Pexels.)](/images/examples-onlineimagetools/plants.jpg)
data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/4gxYSUNDX1BST0ZJTEUAAQEAAAxITGlubwIQAABtbnRyUkdCIFhZWiAHzgACAAkABgAxAABhY3NwTVNGVAAAAABJRUMgc1JHQgAAAAAAAAAAAAAAAAAA9tYAAQAAAADTLUhQICAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA [...]
Convert a PNG Image to a Data URL
In this example, we convert a PNG image of a street in an old town, into a Data URI. The image is transformed into a fully textual format with a prefix indicating the encoding and extension as "image/png;base64". (Source: Pexels.)
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoAAAAL4CAYAAADrvEaPAAAgAElEQVR4Xuy9B5glR3U2fGbmTp7ZrF3lBBJIiGj4SMYkY0wQJlgG2SQTRBDJBBMd/8eBYLDB4AAfNiAwHznY2OQgogGDwCAkgSJKm8Pk+L [...]
Convert a Webp Image to a Data URL
In this example, we load a WebP image and convert it into a Data URI. The output file generated as a Data URI is typically larger in size compared to the original WebP. (Source: Pexels.)
data:image/webp;base64,UklGRpA2AABXRUJQVlA4WAoAAAAgAAAA8wEAkwIASUNDUMgBAAAAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAl [...]
Convert a GIF File to a Data URL
In this example, we demonstrate how to save a GIF file as text-based URI data. We upload a static GIF file and convert it into a URI string with the MIME type "image/gif". Similarly, animated GIF files can also be transformed into URI data. (Source: Pexels.)
data:image/gif;base64,R0lGODlh9AFPAfcAABIREBIRDxAPDxIPDhQQDhURDxQREBUSERQSEhUSEhMRFRERFw4RFwwSGgsSIQ0VIBEUHxMUGxUUGhkXGhwZGxwbHhobIxcbJRQZJBIYJw4XJwwZKQsbKwkbLQgcMgkeNA4fNBIdMRUfLxsgLCEiKC8qKyMnMiEnOBsnOxYlPQ8kPgsiPQcjQAgmRQsqSgstUQgwWAo0XxM3Xxo3Whw0VB0xSx8tRSQuQiowPy0zRis1Sys2Tyw6VTU+VTs8RTc1OTczMj05OFFCOl1KQFNMTj1BTUdLWEJJWkNLXkFMZD1MbjVLcjFMdytKeCdGdidDbiJBahU [...]
Convert a BMP Image to a Data URL
In this example, we convert a BMP image of a cup of morning coffee to a Data URI format. Although the BMP format is already quite large in size due to its uncompressed nature, the resulting URL representation is even larger. This is primarily due to the additional encoding overhead incurred during the conversion process. (Source: Pexels.)
data:image/bmp;base64,Qk16RgUAAAAAAHoAAABsAAAAaAEAABD///8BACAAAwAAAABGBQATCwAAEwsAAAAAAAAAAAAAAAD/AAD/AAD/AAAAAAAA/yBuaVcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACrh3//r4uD/7aSiv+6lo7/tJCK/7WRi/+7lpL/so2J/66Jhf+lgHz/sIqG/6F7d/+Qa2f/jWpm/3haVf9uUUz/X0U+/1hBOf9INS7/U0A7/1E+O/9TPz7/YUlL/29UWP93WFn/jW1u/6F/gP+tiYn/vZeX/8Gbmf+8mZb/yaaj/8Cclv/AnJb/soyH/7CKhv+th4P/t5GP/72Xlf+7mJX/wJ2a/7iVkv++mJb/poB+ [...]
All image tools
Quickly pixelate an area of an image.
Quickly blur an area of an image.
Quickly sharpen an area of an image.
Quickly increase or decrease the brightness of an image.
Quickly increase or decrease the contrast of an image.
Quickly increase or decrease the lightness of an image.
Quickly increase or decrease the hue of an image.
Quickly increase or decrease the saturation of an image.
Quickly add a sepia effect to an image.
Quickly add a rainbow effect to an image.
Quickly apply a popular filter to an image.
Quickly rotate any image by an arbitrary angle.
Quickly resize any image to any size.
Quickly create a larger image from a smaller image.
Quickly create a smaller image from a larger image.
Quickly upsize an image's dimensions proportionally.
Quickly downsize an image's dimensions proportionally.
Quickly crop an area of any image.
Quickly convert a color image to a grayscale image.
Quickly make multiple copies of an image.
Quickly flip an image horizontally.
Quickly flip an image vertically.
Quickly change the orientation of an image to horizontal or vertical.
Quickly add text to any image.
Quickly add annotations (text, labels, arrows, boxes) to images.
Quickly add copyright protection to an image.
Quickly hide information in an image by blurring it or blacking it out.
Quickly add noise (pixel grain) effect to an image.
Quickly convert any color in an image to transparent.
Quickly add translucency to the given image.
Quickly make the background of an image transparent.
Quickly add a background to a transparent image.
Quickly change one color to another in any image.
Quickly change the visual quality of any image.
Quickly convert a PNG image to a JPG image.
Quickly convert a JPG image to a PNG image.
Quickly convert a PNG image to a GIF image.
Quickly convert a GIF image to a PNG image.
Quickly convert a PNG image to a BMP image.
Quickly convert a BMP image to a PNG image.
Quickly convert a WebP image to a JPG image.
Quickly convert a JPG image to a WebP image.
Quickly convert a WebP image to a PNG image.
Quickly convert a PNG image to a WebP image.
Quickly convert a WebP image to a GIF image.
Quickly convert a GIF image to a WebP image.
Quickly convert a WebP image to a BMP image.
Quickly convert a BMP image to a WebP image.
Quickly base64-encode a PNG image.
Quickly decode a base64-encoded PNG image.
Quickly convert a BMP image to a GIF image.
Quickly convert a GIF image to a BMP image.
Quickly convert a JPEG image to a bitmap image.
Quickly convert a bitmap image to a JPEG image.
Quickly base64-encode a BMP image.
Quickly base64-decode a bitmap image.
Quickly base64-encode a WebP image.
Quickly base64-decode a bitmap image.
Quickly convert a JPEG image to a single-frame GIF image.
Quickly convert an animated GIF to a JPEG image.
Quickly convert a GIF to base64 encoding.
Quickly convert a base64 encoding to a GIF.
Quickly view and extract frames from GIF animations.
Quickly play a GIF animation frame by frame.
Quickly base64-encode a JPEG image.
Quickly decode a base64-encoded JPEG image.
Quickly change the compression level of a JPG image.
Quickly make the file size of an image smaller.
Quickly convert an image to base64 encoding.
Quickly convert base64 encoding to an image.
Quickly convert an image to a Data URL.
Quickly convert a Data URL to an image.
Quickly add a border around an image.
Quickly remove the border that surrounds the image.
Quickly pad an image from all sides.
Quickly expand an image by adding space around it.
Quickly make corners of any image rounded.
Quickly generate a random image.
Quickly generate an image from text typed on your keyboard.
Quickly explode an image into a bunch of tiny pieces.
Quickly cut an image into horizontal or vertical strips.
Quickly convert all colors in an image to just black and white.
Quickly convert a multicolor image to a duotone image.
Quickly convert an image to the binary art.
Quickly run a dithering algorithm on an image.
Quickly decrease the number of colors in an image.
Quickly simplify the color scheme of the image.
Quickly create a custom image of any color and width/height.
Quickly create an empty image of arbitrary size.
Quickly create a one-color image of the desired shade.
Quickly invert all pixels in an image to the opposite color.
Quickly use a color picker to select a color in an image.
Quickly find dominant colors in an image.
Quickly find the tones that form the color palette of the image.
Quickly generate image size, format, pixel, and color palette information.
Quickly determine the image file size in bytes and kilobytes.
Quickly find the width, height, orientation, and aspect ratio of an image.
Quickly open and view images in your browser.
Quickly redraw an image using only web-safe colors.
Quickly separate RGBA, CMYK, and HSL channels from an image.
Quickly show the red, green, blue, and alpha channel of the RGBA color scheme.
Quickly show the hue, saturation, and light channels of the HSL color scheme.
Quickly show the hue, saturation, and value channels of the HSV color scheme.
Quickly show the hue, saturation, and intensity channels of the HSI color scheme.
Quickly show the cyan, magenta, yellow, and key channels of the CMYK color scheme.
Quickly show the lightness, A, and B channels of the LAB color scheme.
Quickly show the luma (Y) and chrominance (I and Q) channels of the YIQ color scheme.
Quickly show the hue, chroma, and luminance channels of the HCL color scheme.
Quickly show the luminance, chroma, and hue channels of the LCH color scheme.
Quickly show the Y (luma), Cb (blue-difference), and Cr (red-difference) channels of the YCbCr color scheme.
Quickly change the base color scheme in the image.
Quickly refine the image object's edges by removing noisy pixels.
Quickly select any object in the image and extract it by its color.
Quickly remove a specific color region from any image.
Quickly remove a green screen from any image.
Quickly remove a chroma key from any image.
Quickly check if an image has transparent pixels.
Quickly view transparent, semi-transparent, and opaque areas in an image.
Quickly rotate pixels around a central point in an image.
Quickly convert an image to a polaroid snapshot.
Quickly add a symmetrical part to your image.
Quickly optimize the quality of an image.
Quickly add a block or glitch compression effect to the image.
Quickly convert an image to R, G, B values.
Quickly create an image from an R, G, B array.
Quickly convert an image to hex codes.
Quickly create an image from a list of hex codes.
Quickly convert a set of symbols into an image using color assignment rules.
Coming soon These image tools are on the way
Image Editor
Edit images in your browser.
Create a Fibonacci Spiral
Place images on a grid so that they make a Fibonacci spiral.
Convert PNG to ICO
Convert a PNG image to an ICO icon.
Convert ICO to PNG
Convert an ICO icon to a PNG image.
Convert PNG to TIFF
Convert a PNG image to a TIFF image.
Convert TIFF to PNG
Convert a TIFF image to a PNG image.
Convert JPG to ICO
Convert a JPEG image to an ICO icon.
Convert ICO to JPG
Convert an ICO icon to a JPEG image.
Convert JPG to TIFF
Convert a JPEG image to a TIFF image.
Convert TIFF to JPG
Convert a TIFF image to a JPEG image.
Convert GIF to ICO
Convert a GIF image to an ICO icon.
Convert ICO to GIF
Convert an ICO icon to a GIF image.
Convert GIF to TIFF
Convert a GIF image to a TIFF image.
Convert TIFF to GIF
Convert a TIFF image to a GIF image.
Convert GIF to Animated PNG
Convert a GIF image to an APNG icon.
Convert Animated PNG to GIF
Convert an APNG image to a PNG image.
Convert BMP to ICO
Convert a bitmap image to an ICO icon.
Convert ICO to BMP
Convert an ICO icon to a bitmap image.
Convert BMP to TIFF
Convert a bitmap image to a TIFF image.
Convert TIFF to BMP
Convert a TIFF image to a bitmap image.
Convert Webp to ICO
Convert a Webp image to an ICO icon.
Convert ICO to Webp
Convert an ICO icon to a Webp image.
Convert Webp to TIFF
Convert a Webp image to a TIFF image.
Convert TIFF to Webp
Convert a TIFF image to a Webp image.
Create an Animated GIF
Create an animated GIF image from static frames.
Create Image from BGR Array
Create an image from an B, G, R array.
Create Image from RGBA Array
Create an image from an R, G, B, A array.
Create Image from BGRA Array
Create an image from an B, G, R, A array.
Enhance Image Quality
Increase the quality of an image.
Reduce Image Quality
Decrease the quality of an image.
Extract Text from Image
Apply OCR on an image and extract all text from it.
Remove Text from Image
Erase text or label from an image.
Remove Object from Image
Erase any object from an image.
Split an Image
Split an image into parts.
Slice an Image
Slice a part of an image.
Skew an Image
Skew an image by the given angle.
Shift an Image
Shift an image to the left or to the right.
Create a Thumbnail
Convert an image to a thumbnail
Create a Glitch Image
Convert a PNG, GIF, JPG or BMP to glitch art.
Run Zalgo on an Image
Let Zalgo destroy an image.
Convert Image Color Space
Change an image color space to HSL, HSV, CMYK, or RGB.
Convert Image Bits Per Pixel
Change an image bit depth to 32, 24, 16, 8, 4, 2 bits or just 1 bit.
Create an Image Mosaic
Create a mosaic wall from multiple images.
Generate ASCII Art from an Image
Create an ASCII art image from a regular image.
Generate ANSI Art from an Image
Create an ANSI art image from a regular image.
Generate Unicode Art from an Image
Create a Unicode art image from a regular image.
Generate Braille Art from an Image
Create a Braille art image from a regular image.
Add a Label to an Image
Add a short one-line label to an image.
Delete a Watermark from an Image
Remove a watermark from an image.
Add Halftone Effect to an Image
Create an image made out of dots of varying size and spacing.
Blockify an Image
Convert an image to a bunch of blocks.
Add Progressive Effect to an Image
Create a GIF from the original image with interlacing effect.
Subscribe! Never miss an update
Cool!
Notifications We'll let you know when we add this tool
Cool!
Feedback we'd love to hear from you!
Created with love by ![browserling]()
51K
@browserling
We're Browserling — a friendly and fun cross-browser testing company powered by alien technology. At Browserling we love to make people's lives easier, so we created this collection of image editing tools. Our tools have the simplest user interface that doesn't require advanced computer skills and they are used by millions of people every month. Our image tools are actually powered by our web developer tools that we created over the last couple of years. Check them out!
Secret message
If you love our tools, then we love you, too! Use coupon code IMAGELING to get a discount for our premium plans.
Privacy Policy we don't log data!
All conversions and calculations are done in your browser using JavaScript. We don't send a single bit about your input data to our servers. There is no server-side processing at all. We use Google Analytics and StatCounter for site usage analytics. Your IP address is saved on our web server for additional analytics. The free plan doesn't use cookies and don't store session information in cookies. The premium and team plans use cookies to store session information so that you are always logged in. We use your browser's local storage to save tools' input. It stays on your computer.
Terms of Service the legal stuff
By using Online Tools you agree to our Terms of Service. All tools are free for personal use but to use them for commercial purposes, you need to get a premium plan. You can't do illegal or shady things with our tools. We may block your access to tools, if we find out you're doing something bad. We're not liable for your actions and we offer no warranty. We may revise our terms at any time.