- How do I encode an image to Base64 for HTML or CSS embedding?
- Upload your image (PNG, JPG, GIF, SVG, or WebP) using drag-and-drop or the file picker. The tool generates the complete Base64 string with the correct data URI prefix (e.g., data:image/png;base64,...). Copy the output and paste it directly into an HTML <img> src attribute or a CSS background-image: url() property to embed the image inline without a separate HTTP request.
- Can I decode a Base64 string from an API response back to a file?
- Yes. Paste the Base64 string (with or without the data URI prefix) into the decode section. Set your desired filename and file extension (e.g., report.pdf, photo.jpg). The tool reconstructs the original binary file, which you can then download directly. This works for any file type — images, PDFs, documents, audio, video, and binary data.
- What file types can I encode to Base64 with this tool?
- The encoder supports all file types: images (PNG, JPG, GIF, SVG, WebP, BMP, ICO), documents (PDF, DOCX, XLSX, PPTX, TXT, CSV), audio (MP3, WAV, OGG, AAC), video (MP4, WebM, AVI), fonts (WOFF, WOFF2, TTF, OTF), and any other binary file. MIME type detection is automatic based on the uploaded file's extension.
- Does Base64 encoding increase file size, and by how much?
- Yes. Base64 encoding increases file size by approximately 33%. This is because Base64 represents every 3 bytes of binary data as 4 ASCII characters. A 30 KB image becomes approximately 40 KB when Base64-encoded. For web embedding, this overhead is acceptable for small assets (under 10 KB) but larger files should be served as separate resources.
- Can I preview decoded Base64 image data before downloading?
- Yes. When the decoded Base64 data represents an image (PNG, JPG, GIF, SVG, or WebP), the tool displays an inline preview so you can verify the content is correct before downloading the file. This is useful for validating Base64 image strings from API responses or database fields.
- Is my file data sent to a server during Base64 encoding or decoding?
- No. All Base64 encoding and decoding is performed entirely in your browser using JavaScript's built-in FileReader API. Your files and Base64 data never leave your device, making the tool safe for processing sensitive documents, confidential images, and proprietary file data.
- What is a data URI and how do I use the Base64 output in HTML?
- A data URI is a string format (data:[MIME-type];base64,[encoded-data]) that embeds file content directly in HTML or CSS. After encoding your file, copy the complete data URI string and use it as the src attribute in an HTML <img> tag or as the url() value in a CSS background-image property. Example: <img src='data:image/png;base64,iVBOR...' />. This eliminates the need for a separate image file and HTTP request.
