What is Image to Base64?
Image to Base64 uses FileReader to read a local PNG, JPEG, WebP, GIF, SVG, or other browser-recognized image and create a complete MIME-prefixed Data URL. It also displays a local preview and byte information for small inline resources, API test fixtures, and encoding inspection. Base64 increases size and is not image compression. Common workflows include the following. Convert a small icon or test image into a copyable Data URL. Prepare image-encoding examples for an API, email template, or offline page. Compare the source MIME type and size with the Base64 representation. The page also documents input boundaries, output behavior, and practical cautions so you can review the result before putting it into an application, configuration, test, or production workflow.
When to use it
- Convert a small icon or test image into a copyable Data URL.
- Prepare image-encoding examples for an API, email template, or offline page.
- Compare the source MIME type and size with the Base64 representation.
How to use it
- Choose a local image or load the built-in SVG example.
- Check its MIME type and size.
- Convert, preview, and copy the Data URL.
- Load one of the realistic examples first to verify the selected options and processing direction before replacing it with your own data.
- Review the output, status message, and documented limits; copy, download, or continue only after the result matches your expectation.
Runnable examples
The “Example 1” and “Example 2” buttons load the matching inputs. They cover different structures, directions, or boundaries and can be run directly in the workspace.
Example 1
data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMjAiIGhlaWdodD0iMTgwIj48cmVjdCB3aWR0aD0iMzIwIiBoZWlnaHQ9IjE4MCIgcng9IjI0IiBmaWxsPSIjMTAyNDNlIi8+PHRleHQgeD0iMTYwIiB5PSIxMDAiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGZvbnQtc2l6ZT0iMzIiIGZpbGw9IiM3NGRmYzkiPkpTT05MYW5lPC90ZXh0Pjwvc3ZnPg==Example 2
data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzE4MzM0MiIvPjxjaXJjbGUgY3g9IjMyMCIgY3k9IjEwMCIgcj0iNzAiIGZpbGw9IiMyNmI2YTQiLz48dGV4dCB4PSIzMCIgeT0iMTEwIiBmb250LXNpemU9IjI0IiBmaWxsPSIjZjNmOGZhIj7mnKzlnLDlpITnkIY8L3RleHQ+PC9zdmc+Input rules
- The file picker accepts local files recognized as image/* by the browser.
- One file may not exceed 10 MiB, and built-in examples use the same parser.
- Preview support for SVG, GIF, or newer formats depends on the current browser.
- Text input is counted before processing and is limited to 15,000,000 characters on this page; file modes apply the separate file limit shown in the workspace.
- Files are limited to 10 MiB.
Output rules
- The result begins with data:image/...;base64, and contains the complete file bytes.
- Base64 is commonly about one third larger than the binary source.
- The tool does not resize, recompress, edit metadata, or change image quality.
- Output reflects only the current input, direction, and options; rerun after changing a mode or value instead of treating an earlier result as current.
- Base64 does not compress the image.
Limitations and cautions
- Files are limited to 10 MiB.
- Base64 does not compress the image.
- Very long Data URLs are not suitable for every production page.
How your data is handled
The selected file is read and converted directly by the browser and is never uploaded to JSONLane. Preview and Data URL state exist only on the page.