JSFiddle - React, Tailwind, and code Playground

by Christian Sonne

HTML

<img id="img"...

JavaScript

let ctx = c.getContext("2d");
c.width=img.width;
c.height=img.height;
ctx.drawImage(img, 0, 0);
let imgData = ctx.getImageData(0,0,c.width,c.height);
let data = imgData.data;
for (let i=0; i<c.height*c.width;i++) {
    let idx = i*4;
  let color = Math.random()*255<data[idx] ? 255 : 0;
  data[idx] = data[idx+1] = data[idx+2] = color;
  data[idx+3] = 255;
}
ctx.putImageData(imgData, 0, 0);