demo · v137

Exposure Stops

Render the same scene at multiple exposure stops — divide every pixel value by 2 per stop — in unorm8 vs float16. Below 1/256 the 8-bit canvas falls into a black hole; float16 keeps resolving detail down to ~10⁻⁵. The use case the spec authors call out: medical imaging, where a sub-stop of resolution matters.

probing…

unorm8 (default)

float16

the code

// Render the same scene at sub-1.0 luminance.
const ctx = canvas.getContext("2d", {
  colorSpace: "display-p3",
  pixelFormat: "float16",
});

const img = new ImageData(w, h, { pixelFormat: "float16" });
for (let i = 0; i < img.data.length; i += 4) {
  // exposure stop: divide by 2^N
  const lin = scene[i / 4] / Math.pow(2, stops);
  img.data[i]     = lin;  // red
  img.data[i + 1] = lin;  // green
  img.data[i + 2] = lin;  // blue
  img.data[i + 3] = 1;
}
ctx.putImageData(img, 0, 0);

see also