Utilizo el siguiente código para buscar imágenes en la PC y luego las muestro en un navegador en mi página. Muestra imágenes, pero los píxeles que se supone que son transparentes son solo blancos o grises, simplemente no tiene en cuenta el canal alfa. ¿Hay alguna manera de arreglarlo de alguna manera? Realmente no entiendo todo el mecanismo detrás de la carga de imágenes en JS, si cargo explícitamente con la ruta relativa especificada en los archivos css o html, entonces funciona bien, pero cuando uso este método, por alguna razón, no funciona correctamente con transparencia.

 BLOCK_PICTURE.addEventListener("click", function (e) { if (!currentElement) return; let input = document.createElement("input"); input.type = "file"; input.addEventListener("change", function () { const reader = new FileReader(); reader.addEventListener("load", function () { mainImage = reader.result; document.getElementById(currentElement.name).style.backgroundImage = `url(${mainImage})`; blocks[currentElement.count].background = mainImage; }); reader.readAsDataURL(this.files[0]); }); input.click(); });