Upload Image
Click, Drop or Paste
Uploading…
const apiKey = "08088ff7f0c23f1a1e94793cde2e3124";
let apiData=null;
const imgInput=document.getElementById("imgInput");
const dropZone=document.getElementById("dropZone");
dropZone.onclick=()=>imgInput.click();
imgInput.onchange=()=>processUpload(imgInput.files[0]);
function switchTab(t){
document.querySelectorAll(".tab").forEach(e=>e.classList.remove("active"));
document.querySelectorAll(".tab")[t==="file"?0:1].classList.add("active");
fileSection.style.display=t==="file"?"block":"none";
urlSection.style.display=t==="url"?"block":"none";
}
function uploadUrl(){
const u=urlInput.value.trim();
if(u)processUpload(u);
}
function processUpload(src){
mainInputArea.style.display="none";
loadingArea.style.display="block";
const fd=new FormData();
fd.append("key",apiKey);
fd.append("image",src);
fetch("https://api.imgbb.com/1/upload",{method:"POST",body:fd})
.then(r=>r.json())
.then(d=>{
loadingArea.style.display="none";
if(d.success){
apiData=d.data;
resultArea.style.display="block";
imgPreview.src=apiData.url;
outputCode.value=apiData.url;
}else resetUploader();
});
}
function copyCode(){
navigator.clipboard.writeText(outputCode.value);
}
function resetUploader(){
apiData=null;
imgInput.value="";
urlInput.value="";
resultArea.style.display="none";
mainInputArea.style.display="block";
}