Agustin Capeletto

place-content: space-time

This is CSS 🚀

model: maxparata.itch.io
demo: voxcss.com/gallery?mode...

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

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!

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 — CSS voxel engine for the DOM A DOM-based voxel engine that renders HTML cuboids with CSS grids, transforms, textures, and dimetric projections.

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/

Layoutit Voxels - 3D CSS Grid Generator A voxel editor powered by CSS grid and 3D transforms. Build models with HTML cuboids!

makin characters with the kids tonight, CSS minecraft style voxels.layoutit.com

LOL. This is just starting! ❤

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

GitHub - LayoutitStudio/voxcss: A DOM based voxel engine. Renders HTML cuboids by stacking CSS grid layers and applying 3D transforms. A DOM based voxel engine. Renders HTML cuboids by stacking CSS grid layers and applying 3D transforms. - 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