<p id="base64-string"></p>
function imageToBase64(url, callback) {
fetch(url)
.then(response => response.blob())
.then(blob => {
const reader = new FileReader();
reader.readAsDataURL(blob);
reader.onloadend = () => {
const base64String = reader.result;
callback(base64String);
};
});
}
const imageUrl = 'https://picsum.photos/200';
imageToBase64(imageUrl, function(base64String){
document.body.style.background = `url(${base64String}) no-repeat center`;
console.log(base64String);
});
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.