place-content: space-time
place-content: space-time
This is CSS 🚀
model: maxparata.itch.io
demo: voxcss.com/gallery?mode...
Matias, Agustín, and Zorro
a special #caturday, family reunion with @ekrof.bsky.social 😸
my brother is no longer working on a game powered by his own 3D css grid only engine. he is now crafting a collection of games to build a full VoxCSS arcade. you see? he's also going meta as soon as he has the chance. it isn't my fault i can't stop playing the meta game. it runs in the family
engine: github.com/LayoutitStud...
levels: github.com/google-deepm...
feedback: always welcome
Voxoban is a Sokoban-inspired 3D CSS puzzle game.
Ported Sokoban to 3D CSS: voxoban.com
I'm building a VoxCSS arcade 👾
Thank you! <3
I just pushed that and some other QoL improvements, like free rotation of the board. FPS should run much smoother now.
tileset: github.com/FluffyStuff/...
engine: github.com/LayoutitStud...
feedback: always welcome!
A CSS-driven Mahjong Solitaire.
Built a CSS Mahjong over the weekend: voxjong.com
Powered by my relentless quest to conquer the 3D DOM.
This is CSS 👽
model: maxparata.itch.io
demo: voxcss.com/gallery/?mod...
Check out and inspect the volume renderer in action at the VoxCSS gallery <3
voxcss.com/gallery
Volume rendering in CSS can be achieved by slicing a 3D scene into 2D grids along each axis. Each slice is a cross-section where occupied cells are painted and translated at fixed intervals.
The problem then becomes: how can we recreate each grid pattern with the least number of DOM nodes?
Well this is remarkable. 😮
Someone built a 3D voxel engine using plain ol’ DOM nodes, no canvas/webgl. And it’s surprisingly performant, since it culls any faces that aren’t currently visible.
Repo: github.com/LayoutitStud...
There’s even a nifty lil’ editor!
VoxCSS, a CSS voxel engine. I like how CSS grid is used!
voxcss.com
Experimenting with a new grid stack for 3D volume rendering in CSS. Try it! voxcss.com/gallery/
makin characters with the kids tonight, CSS minecraft style voxels.layoutit.com
LOL. This is just starting! ❤
Half an apple, in big 3d cubes.
An illustration for how voxcss works, showing a superposition of CSS grids.
Now this is cool! VoxCSS draws voxels by using CSS 3D cubes, but what's cool is they're organized in stacks of CSS grids along the Z axis.
VoxCSS now supports voxel merging across all dimensions. Bigger scenes, fewer DOM nodes.
github.com/LayoutitStud...
Imagine crafting vibrant 3D worlds directly in your browser with tools you already know. VoxCSS brings a DOM-based voxel engine to life, opening new possibilities for interactive web experiences using just HTML and CSS. Dive in: https://github.com/LayoutitStudio/voxcss
Introducing VoxCSS: a DOM based voxel engine
github.com/LayoutitStud...
Agustín Capeletto keeps bending CSS into new dimensions... literally!
His latest article unveils a new terrain generator powered entirely by stacked grids and transforms.
A perfect piece to celebrate him on his birthday: tympanus.net/codrops/2025...
A CSS terrain generator. No WebGL, just stacked grids and 3D transforms: terra.layoutit.com
Pure CSS meets voxel art! 🧊✨
Agustin Capeletto takes us behind the scenes of the CSS Voxel Editor, showing how stacked grids, transforms, and perspective create a fully addressable 3D space—no JavaScript required: tympanus.net/codrops/2025...
#3d #css #voxelart #purecss