Back to Home

Base64 Encoder & Decoder

Free online tool to encode text or files to Base64 and decode Base64 back to original format. Fast, secure, and no data is stored on our servers.

100% Free

No hidden costs

Secure

No data stored

Fast

Instant results

Easy

Simple interface

Enter text to encode or Base64 string to decode. For files, use the file upload option.
0 characters 0 bytes

Encode Files to Base64

Drag & drop a file here or click to browse

Supports images, documents, and other file types

0 characters 0 bytes

About Base64 Encoding

What is Base64?

Base64 is a binary-to-text encoding scheme that represents binary data in an ASCII string format. It's commonly used to encode data that needs to be stored and transferred over media designed to deal with text.

Common Uses

  • Email attachments (MIME)
  • Embedding images in HTML or CSS
  • Storing complex data in JSON or XML
  • Data URIs
  • Basic authentication HTTP headers

How It Works

Base64 encoding converts every 3 bytes of binary data into 4 ASCII characters. The encoded data is approximately 33% larger than the original binary data.

Our Tool Features

  • Encode text to Base64
  • Decode Base64 to text
  • Encode files to Base64 strings
  • URL-safe encoding option
  • Line break formatting
  • Conversion history
  • Copy and download results

Frequently Asked Questions

Is Base64 encoding secure?

Base64 is not encryption and provides no security. It's simply an encoding method to represent binary data as text. Anyone can decode Base64 data back to its original form.

What is the difference between encoding and encryption?

Encoding transforms data into a different format for efficient transmission or storage. Encryption transforms data to keep it secret from unauthorized parties, requiring a key to decrypt.

Can I encode large files with this tool?

Our tool can handle files up to 10MB in size. For larger files, consider using desktop applications or specialized software.

What characters are used in Base64 encoding?

Base64 uses A-Z, a-z, 0-9, +, / and = (for padding). URL-safe Base64 replaces + with - and / with _ to avoid issues in URLs.

Related Tools

URL Encoder

JSON Formatter

All your essential tools in one place. Free, fast, and easy to use for all your daily tasks.

Quick Links

Popular Tools

Contact Us

© 2023 Toolora. All rights reserved. Developed by Saheb Ansari

document.getElementById('fileName'); const fileSize = document.getElementById('fileSize'); const inputCharCount = document.getElementById('inputCharCount'); const inputByteCount = document.getElementById('inputByteCount'); const outputCharCount = document.getElementById('outputCharCount'); const outputByteCount = document.getElementById('outputByteCount'); const outputStatus = document.getElementById('outputStatus'); const historySection = document.getElementById('historySection'); const historyList = document.getElementById('historyList'); const advancedOptions = document.getElementById('advancedOptions'); const advancedBtn = document.getElementById('advancedBtn'); const sampleBtn = document.getElementById('sampleBtn'); const urlSafeCheckbox = document.getElementById('urlSafe'); const lineBreaksCheckbox = document.getElementById('lineBreaks'); // Initialize document.addEventListener('DOMContentLoaded', function() { // Back button animation gsap.from("#backHome", { y: -20, duration: 0.6, delay: 0.2, ease: "power2.out" }); // Load sample text sampleBtn.addEventListener('click', function() { inputText.value = "Sample text to encode/decode with Base64"; updateCharCounts(); }); // Update character counts inputText.addEventListener('input', updateCharCounts); outputText.addEventListener('input', updateOutputCounts); // Initialize character counts updateCharCounts(); updateOutputCounts(); // Load conversion history loadHistory(); // Set up file drop zone setupDropZone(); }); function updateCharCounts() { const text = inputText.value; const charCount = text.length; const byteCount = new Blob([text]).size; inputCharCount.textContent = `${charCount} characters`; inputByteCount.textContent = `${byteCount} bytes`; } function updateOutputCounts() { const text = outputText.value; const charCount = text.length; const byteCount = new Blob([text]).size; outputCharCount.textContent = `${charCount} characters`; outputByteCount.textContent = `${byteCount} bytes`; } function setupDropZone() { // Click to select file dropZone.addEventListener('click', () => fileInput.click()); // Drag and drop events ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => { dropZone.addEventListener(eventName, preventDefaults, false); }); function preventDefaults(e) { e.preventDefault(); e.stopPropagation(); } ['dragenter', 'dragover'].forEach(eventName => { dropZone.addEventListener(eventName, highlight, false); }); ['dragleave', 'drop'].forEach(eventName => { dropZone.addEventListener(eventName, unhighlight, false); }); function highlight() { dropZone.classList.add('active'); } function unhighlight() { dropZone.classList.remove('active'); } // Handle dropped files dropZone.addEventListener('drop', handleDrop, false); function handleDrop(e) { const dt = e.dataTransfer; const files = dt.files; fileInput.files = files; handleFileSelect(); } } function encodeText() { triggerPopunder() const input = inputText.value.trim(); if (!input) { alert("Please enter some text to encode."); return; } try { let base64 = btoa(unescape(encodeURIComponent(input))); // Apply advanced options if selected if (urlSafeCheckbox.checked) { base64 = base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, ''); } if (lineBreaksCheckbox.checked) { base64 = base64.replace(/(.{76})/g, "$1\n"); } outputText.value = base64; outputStatus.textContent = "Encoded successfully"; outputStatus.className = "text-sm text-green-500"; updateOutputCounts(); addToHistory('encode', input, base64); // Animation effect gsap.fromTo(outputText, {backgroundColor: "#d1fae5"}, {backgroundColor: "#f9fafb", duration: 1}); } catch (e) { alert("Error encoding text: " + e.message); } } function decodeText() { triggerPopunder() const input = inputText.value.trim(); if (!input) { alert("Please enter a Base64 string to decode."); return; } try { // Handle URL-safe Base64 if detected let base64 = input; if (base64.includes('-') || base64.includes('_')) { base64 = base64.replace(/-/g, '+').replace(/_/g, '/'); // Add padding if necessary while (base64.length % 4) { base64 += '='; } } // Remove line breaks if present base64 = base64.replace(/\s/g, ''); const decoded = decodeURIComponent(escape(atob(base64))); outputText.value = decoded; outputStatus.textContent = "Decoded successfully"; outputStatus.className = "text-sm text-green-500"; updateOutputCounts(); addToHistory('decode', input, decoded); // Animation effect gsap.fromTo(outputText, {backgroundColor: "#d1fae5"}, {backgroundColor: "#f9fafb", duration: 1}); } catch (e) { alert("Error decoding text - make sure it's valid Base64: " + e.message); } } function handleFileSelect() { const file = fileInput.files[0]; if (!file) return; // Check file size (limit to 10MB) if (file.size > 10 * 1024 * 1024) { alert("File is too large. Please select a file smaller than 10MB."); fileInput.value = ""; return; } // Update file info display fileName.textContent = file.name; fileSize.textContent = formatFileSize(file.size); fileInfo.classList.remove('hidden'); const reader = new FileReader(); reader.onload = function(e) { const base64String = e.target.result.split(',')[1] || e.target.result; outputText.value = base64String; inputText.value = `File: ${file.name}`; outputStatus.textContent = "File encoded successfully"; outputStatus.className = "text-sm text-green-500"; updateOutputCounts(); addToHistory('file-encode', file.name, base64String.substring(0, 100) + '...'); // Animation effect gsap.fromTo(outputText, {backgroundColor: "#d1fae5"}, {backgroundColor: "#f9fafb", duration: 1}); }; reader.readAsDataURL(file); } function clearFile() { fileInput.value = ""; fileInfo.classList.add('hidden'); } function formatFileSize(bytes) { if (bytes < 1024) return bytes + " bytes"; else if (bytes < 1048576) return (bytes / 1024).toFixed(2) + " KB"; else return (bytes / 1048576).toFixed(2) + " MB"; } function copyOutput() { triggerPopunder() const output = outputText; if (!output.value) { alert("No result to copy."); return; } output.select(); document.execCommand("copy"); // Visual feedback const originalText = outputStatus.textContent; outputStatus.textContent = "Copied to clipboard!"; outputStatus.className = "text-sm text-blue-500"; setTimeout(() => { outputStatus.textContent = originalText; outputStatus.className = "text-sm text-green-500"; }, 2000); } function downloadResult() { triggerPopunder() const output = outputText.value; if (!output) { alert("No result to download."); return; } const blob = new Blob([output], { type: 'text/plain' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = 'base64-result.txt'; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } function clearFields() { inputText.value = ""; outputText.value = ""; fileInput.value = ""; fileInfo.classList.add('hidden'); outputStatus.textContent = ""; updateCharCounts(); updateOutputCounts(); } function toggleAdvanced() { advancedOptions.classList.toggle('hidden'); if (advancedOptions.classList.contains('hidden')) { advancedBtn.innerHTML = ' Advanced Options'; } else { advancedBtn.innerHTML = ' Close Options'; } } // Conversion History function addToHistory(type, input, output) { const history = getHistory(); const item = { type: type, input: input.length > 50 ? input.substring(0, 50) + '...' : input, output: output.length > 50 ? output.substring(0, 50) + '...' : output, timestamp: new Date().toISOString() }; history.unshift(item); // Keep only last 10 items if (history.length > 10) { history.pop(); } localStorage.setItem('base64History', JSON.stringify(history)); loadHistory(); } function getHistory() { const history = localStorage.getItem('base64History'); return history ? JSON.parse(history) : []; } function loadHistory() { const history = getHistory(); if (history.length === 0) { historySection.classList.add('hidden'); return; } historySection.classList.remove('hidden'); historyList.innerHTML = ''; history.forEach((item, index) => { const div = document.createElement('div'); div.className = 'history-item p-2 rounded cursor-pointer fade-in'; div.innerHTML = `
${item.type === 'encode' ? 'Encode' : item.type === 'decode' ? 'Decode' : 'File Encode'} ${new Date(item.timestamp).toLocaleTimeString()}
${item.input}
${item.output}
`; div.addEventListener('click', () => { // For simplicity, just populate the input with the original input // In a real implementation, you might want to restore the exact state inputText.value = item.input; updateCharCounts(); }); historyList.appendChild(div); }); } function clearHistory() { localStorage.removeItem('base64History'); historySection.classList.add('hidden'); }