Online Base64 Encode & Decode Tool with JavaScript Functions
This online Base64 tool lets you instantly encode and decode text, JSON, HTML, and uploaded files directly in your browser. It includes dedicated Base64 Encode and Decode utilities, a File to Base64 converter with Data URI output, and ready-to-use JavaScript functions for developers. All conversions support UTF-8, multiple languages, emojis, and special characters, and run securely on the client side without sending data to any server.
Contents
This online tool helps you instantly:
- Encode plain text to Base64
- Decode Base64 back to original text
- Work directly in the browser - no data is sent to the server
- Copy results with one click
- Use ready JavaScript functions in your own projects
What is Base64?
Base64 is a binary-to-text encoding method that converts binary data into a readable ASCII string. It uses a set of 64 characters (A–Z, a–z, 0–9, +, /) to safely represent data for transmission through text-based systems such as email, HTTP, and JSON. Base64 increases the data size by about 33%, but it ensures that files and text remain intact without corruption across different platforms and protocols.
Convert any text into Base64 instantly. The encoder supports multiple languages, emojis, symbols, JSON, HTML, URLs, and plain text. The result is a safe ASCII string ready for use in APIs, email systems, data storage, and web applications.
Supports: all languages, emojis, symbols, JSON, HTML, URLs
Text to encode as Base64:
Paste any Base64 encoded string to decode it back to the original readable text. The decoder fully supports UTF-8 content including multiple languages, emojis, JSON, and HTML. All processing happens securely in your browser with no data sent to any server.
Convert any file into Base64 format directly in your browser. Upload images, PDFs, text files, or documents up to 2MB maximum size, and instantly get both the raw Base64 string and the ready-to-use Data URI code for embedding in HTML, CSS, or APIs. All conversion happens locally without sending your file to any server.
Use this simple JavaScript function to convert any UTF-8 text, emojis, JSON, HTML, or multilingual content into Base64 format directly in the browser. It safely handles special characters and produces an ASCII string ready for APIs, URLs, and data storage.
const encodeBase64 = (text) => {
// Validate input
if (text === null || text === undefined) {
return {
success: false,
data: null,
error: "Input cannot be null or undefined"
};
}
// Convert to string if not already
if (typeof text !== 'string') {
text = String(text);
}
try {
const encoder = new TextEncoder();
const uint8Array = encoder.encode(text);
let binary = '';
uint8Array.forEach(byte => {
binary += String.fromCharCode(byte);
});
const base64Text = btoa(binary);
return {
success: true,
data: base64Text
};
} catch (error) {
return {
success: false,
data: null,
error: `Failed to encode base64: ${error.message}`
};
}
};Usage:
// usage
const inputText = 'Hello World 👋🌍';
const result = encodeBase64(inputText);
if (result.success) {
console.log('Encoded:', result.data); // SGVsbG8gV29ybGQg8J+Ri/CfjI0=
} else {
console.error('Error:', result.error);
}This JavaScript function decodes Base64 strings back to their original readable text, supporting all languages, emojis, and structured formats like JSON or HTML. The conversion runs entirely on the client side without sending data to any server.
const decodeBase64 = (base64) => {
if (typeof base64 !== "string" || base64.trim() === "") {
return {
success: false,
data: null,
error: "Input must be a non-empty string"
};
}
try {
const binary = atob(base64);
const bytes = new Uint8Array(binary.length);
for (let i = 0; i < binary.length; i++) {
bytes[i] = binary.charCodeAt(i);
}
const decoder = new TextDecoder();
const text = decoder.decode(bytes);
return { success: true, data: text };
} catch (error) {
return { success: false, data: null, error: error.message };
}
};Usage:
// Usage:
const base64text = 'SGVsbG8gQmFzZTY0';
const result = decodeBase64(base64text);
if (result.success) {
console.log(result.data); // Hello Base64
} else {
console.error(result.error);
}Use this JavaScript function to convert any uploaded file into both raw Base64 and full Data URI code directly in the browser. It supports images, PDFs, and text files up to 2MB, processes everything client-side, and provides output ready for HTML embedding
<input type="file" id="fileInput">
<div id="error"></div>
<textarea id="base64Output" rows="10" cols="40" placeholder="Base64 output"></textarea>
<textarea id="dataUriOutput" rows="10" cols="40" placeholder="Data URI output"></textarea>(() => {
const MAX_FILE_SIZE_BYTES = 2 * 1024 * 1024; // 2MB
const fileInput = document.getElementById("fileInput"),
error = document.getElementById("error"),
base64Output = document.getElementById("base64Output"),
dataUriOutput = document.getElementById("dataUriOutput");
if (!fileInput) {
throw new Error("File input element not found");
}
const resetOutputs = () => {
error.textContent = "";
base64Output.value = "";
dataUriOutput.value = "";
};
const readFileAsDataURL = (file) =>
new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = () => resolve(reader.result);
reader.onerror = () => reject(new Error("Failed to read file"));
reader.readAsDataURL(file);
});
const extractBase64FromDataUri = (dataUri) => {
const [, base64] = dataUri.split(",", 2);
if (!base64) {
throw new Error("Invalid data URI format");
}
return base64;
};
const handleFileChange = async ({ target }) => {
resetOutputs();
const file = target.files?.[0];
if (!file) return;
if (file.size > MAX_FILE_SIZE_BYTES) {
error.textContent = "File upload size max 2MB allowed.";
return;
}
try {
const dataUri = await readFileAsDataURL(file);
const base64 = extractBase64FromDataUri(dataUri);
base64Output.value = base64;
dataUriOutput.value = dataUri;
} catch (err) {
error.textContent = err.message || "Unexpected error";
}
};
fileInput.addEventListener("change", handleFileChange);
})();