Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Image to Base64</title> </head> <body> <input type="file" id="inputImage" accept="image/*"> <textarea id="outputBase64" rows="10" cols="80" readonly></textarea> <script> document.getElementById('inputImage').addEventListener('change', function(event) { const file = event.target.files[0]; const reader = new FileReader(); reader.onloadend = function() { const base64 = reader.result; document.getElementById('outputBase64').value = base64; }; reader.readAsDataURL(file); }); </script> </body> </html>