← Grindshell homeFrom the workshop

Pixgrind

A pixel art editor with layers, palette swapping, reference tracing and photo pixelating, plus a 3D mode: paint any of a model's six sides, give each pixel a depth, and export a .glb. It runs entirely in the browser, and nothing is uploaded. Below is the real editor, running live.

§ 01Live prototypePROTO // PIXGRIND
Open app only↗

Trouble loading? Open it directly at /pixgrind/.

§ 02Developer notes03 NOTES
Architecture
Pure core, no framework

Pixels, palettes, selections, edits, the voxel model and its mesh are pure TypeScript in a core layer that never touches the DOM, so all of it is unit-tested in Node. The UI is vanilla TypeScript over Canvas 2D and WebGL 2, with no runtime dependencies.

Color
Indices, not RGBA

Layers store palette indices, so swapping palettes recolors the whole image without touching a pixel. Pastes and merges keep exact indices; images from anywhere else land on the nearest palette color.

3D
Every pixel is a box

Each painted pixel grows toward the camera of the side it was drawn on, 1 to 1024 deep, square or cut along a diagonal so staircase edges become 45° slopes. GLB export is watertight by default: one closed, manifold solid per color.