Preview image. Unlock full-res
A performant infinite canvas rendering hundreds of image tiles with depth-of-field blur, built without WebGL and stress-tested at scale.
More like this
See all
Summary
A performant infinite canvas rendering hundreds of image tiles with depth-of-field blur, built without WebGL and stress-tested at scale.
Visual description
Hundreds of image tiles float across a light canvas at varying depths, with foreground elements in sharp focus and background tiles fading into soft blur. The scattered arrangement creates an infinite scrolling effect. A performance readout in the top right corner shows 120 FPS, confirming the render engine's efficiency at scale.
Key takeaway
Using selective focus and depth-of-field blur on a tiled grid creates the illusion of three-dimensional space and visual hierarchy without WebGL, drawing attention to foreground content while maintaining high performance at scale.
Reuse notes
Reach for this as a ui screen reference. Pairs with experimental, minimal directions. Original by Anton Proshkuratov.
