{"id":130,"date":"2026-02-13T23:59:00","date_gmt":"2026-02-13T23:59:00","guid":{"rendered":"https:\/\/www.relayed.net\/?post_type=tools&#038;p=130"},"modified":"2026-02-15T00:53:07","modified_gmt":"2026-02-15T00:53:07","slug":"transparency-maker","status":"publish","type":"tools","link":"https:\/\/www.relayed.net\/?tools=transparency-maker","title":{"rendered":"Transparency Maker"},"content":{"rendered":"\n <div class=\"qrt\" data-qrt> <div class=\"qrt-card\"> <div class=\"qrt-h\">QR background remover<\/div>\n <div class=\"qrt-row\"> <input type=\"file\" accept=\"image\/*\" multiple data-in>\n <button type=\"button\" class=\"qrt-btn\" data-run disabled>Convert<\/button>\n <span class=\"qrt-note\" data-note><\/span> <\/div> <div class=\"qrt-grid\" data-out><\/div> <\/div> <\/div>\n <style>\n .qrt{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}\n .qrt-card{max-width:900px;border:1px solid #e5e5e5;border-radius:14px;padding:16px;background:#fff}\n .qrt-h{font-weight:700;font-size:18px;margin:0 0 12px}\n .qrt-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}\n .qrt-btn{border:0;border-radius:10px;padding:10px 14px;background:#111;color:#fff;cursor:pointer}\n .qrt-btn[disabled]{opacity:.45;cursor:not-allowed}\n .qrt-note{font-size:13px;color:#444}\n .qrt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:14px}\n .qrt-item{border:1px solid #eee;border-radius:12px;padding:10px}\n .qrt-prev{width:100%;height:auto;border-radius:10px; background:conic-gradient(#eee 0 25%,#fff 0 50%,#eee 0 75%,#fff 0)\/24px 24px}\n .qrt-name{font-size:12px;color:#222;margin:8px 0 6px;word-break:break-word}\n .qrt-a{display:inline-block;font-size:13px;text-decoration:none;border:1px solid #ddd; padding:8px 10px;border-radius:10px}\n <\/style>\n\n <script>\n (function(){ const roots=[...document.querySelectorAll('[data-qrt]')]; const clamp=n=>n<0?0:(n>255?255:n);\n  const loadImg=f=>new Promise((res,rej)=>{ const i=new Image(); i.onload=()=>res(i); i.onerror=rej; i.src=URL.createObjectURL(f); });\n  async function removeWhiteToBlob(img){ const c=document.createElement('canvas'); const w=img.naturalWidth||img.width, h=img.naturalHeight||img.height;\n  c.width=w; c.height=h; const ctx=c.getContext('2d',{willReadFrequently:true}); ctx.drawImage(img,0,0);\n  const im=ctx.getImageData(0,0,w,h), d=im.data; const THR=245, SOFT=16;\n  for(let i=0;i<d.length;i+=4){ const r=d[i], g=d[i+1], b=d[i+2], a=d[i+3]; if(!a) continue; if(r>=THR && g>=THR && b>=THR){ d[i+3]=0; continue; }\n  if(r>=THR-SOFT && g>=THR-SOFT && b>=THR-SOFT){ const m=Math.min(r,g,b), k=(THR-m)\/SOFT; d[i+3]=clamp(Math.round(a*(1-Math.min(1,Math.max(0,k))))); } }\n  ctx.putImageData(im,0,0); return new Promise(res=>c.toBlob(res,'image\/png')); }\n  function init(root){ const q=(s)=> root.querySelector(s);\n  const inEl=q('[data-in]'), runBtn=q('[data-run]'), out=q('[data-out]'), note=q('[data-note]'); if(!inEl || !runBtn || !out || !note) return; let files=[];\n  inEl.addEventListener('change',()=>{ files=[...inEl.files||[]]; runBtn.disabled=!files.length; out.innerHTML=''; note.textContent=files.length? files.length+' file(s) ready':''; });\n  const addResult=(file,blob)=>{ const url=URL.createObjectURL(blob);\n  const name=file.name.replace(\/\\.[^.]+$\/,'')+'.png'; const div=document.createElement('div'); div.className='qrt-item';\n  div.innerHTML='<img decoding=\"async\" class=\"qrt-prev\" src=\"'+url+'\"><div class=\"qrt-name\">'+name+'<\/div><a class=\"qrt-a\" download=\"'+name+'\" href=\"'+url+'\">PNG<\/a>'; out.appendChild(div); };\n  runBtn.addEventListener('click',async()=>{ runBtn.disabled=true; note.textContent='Converting...'; out.innerHTML=''; let n=0;\n  for(const f of files){ try{ const img=await loadImg(f); const blob=await removeWhiteToBlob(img); addResult(f,blob); n++; } catch(e){} }\n  note.textContent=n+' converted'; runBtn.disabled=false; }); } roots.forEach(init); })();\n<\/script> \n","protected":false},"author":1,"featured_media":136,"template":"","meta":{"org":"","name":"","type":"","content":""},"class_list":["post-130","tools","type-tools","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/www.relayed.net\/index.php?rest_route=\/wp\/v2\/tools\/130","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.relayed.net\/index.php?rest_route=\/wp\/v2\/tools"}],"about":[{"href":"https:\/\/www.relayed.net\/index.php?rest_route=\/wp\/v2\/types\/tools"}],"author":[{"embeddable":true,"href":"https:\/\/www.relayed.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.relayed.net\/index.php?rest_route=\/wp\/v2\/media\/136"}],"wp:attachment":[{"href":"https:\/\/www.relayed.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=130"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}