What this does
Turns a file or a piece of text into a data: URI you can paste straight into HTML, CSS or JSON, and takes existing data URIs apart to show the MIME type, charset, encoding, decoded size and content. Images are previewed, text is shown, and anything can be downloaded as a file.
Generating
The MIME type is detected from the file's leading bytes (PNG, JPEG, GIF, WebP, PDF, fonts, SVG and others) and, if that is inconclusive, from the file name; type your own to override it. Choose Base64, which works for any bytes but makes data about 33% larger, or percent-encoding, which keeps text such as SVG readable and is usually smaller for markup. For images the page also gives you ready-to-use <img> and CSS url() snippets.
Parsing
Follows RFC 2397: data:[<mediatype>][;base64],<data>. An empty media type defaults to text/plain. Base64 payloads may contain line breaks or the URL-safe alphabet and may omit padding. Invalid percent-escapes and invalid Base64 are reported with the position of the problem.
When to use data URIs
Inlining saves a request, which helps for tiny icons, inline SVG backgrounds and email HTML. For anything over a few kilobytes a separate cached file is faster, because data URIs cannot be cached independently of the page and block parsing. Files up to 10 MiB are accepted here, but very large URIs may not work in every browser or tool.
Privacy
Files are read locally and never uploaded.