Canvas Playground

Here's some fucking around with the HTML canvas element, initially mostly to do a funny bit of obscuring images as found in the DOM.

Plain Img

Normal image tag.

CanvasImg

Simple canvas-based copying of the contents and converting to blob. Falls back to source image.

CanvasCopy

A more involved technique, copying sections of the canvas source and rendering them in separate image elements, still falling back to source image.

Single-pixel artifacts on high-dpi and non-1:1 scaled images can be solved by creating an overlapping pixel on each edge. This, however, messes up partial transparency.
Fix Artifacts Use background-image to reduce element count