Vermeer's The Milkmaid painting reimagined as a cloud of color-sampled particles rendered in real time using WebGPU and Three.js, with the figure and composition still recognizable through thousands of floating points of color.
Johannes Vermeer painted The Milkmaid around 1658. She's been standing in that same Rijksmuseum room for centuries, pouring milk that never lands. Dominik Fojcik and Niccolò Miranda decided to finally let her move. Their experiment at Revelium Studio dissolves the painting into a cloud of WebGPU-driven particles using Three.js and TSL, turning 17th-century oil on canvas into living, breathing data points. The colors are Vermeer's. The motion is something else entirely. That iconic yellow bodice, the blue apron, the arc of milk caught mid-pour: all of it scattered into thousands of tiny fragments. It's the kind of thing where you stare for a few seconds, then a few minutes, then realize you've been watching a 366-year-old painting breathe.
On the technical side, this is a clean showcase of what TSL (Three.js Shading Language) and WebGPU compute can do. The particle system isn't just a point cloud for the sake of it. Color data is sampled from the source painting and mapped onto GPU-driven particles, with TSL handling the shading logic in a way that stays renderer-agnostic. If you've been curious about moving from GLSL/WebGL particle setups to the TSL/WebGPU pipeline, this is a good piece to study. The payoff of compute shaders for particle work is immediately visible: the thing runs smooth and the particle count is generous.
If your browser supports WebGPU, go load up the demo and watch a Dutch master's brushwork come apart at the seams in the best possible way.
- Live Demo: https://lab.revelium.studio/milkmaid
- Author(s):