Developer rebuilds Doom using only CSS and HTML, turning divs into a full 3D game engine

TL;DR AI
2 min readKey summary
Niels Leenheer rebuilt Doom so every wall, floor, barrel, and imp is a div transformed in 3D space.
A fully playable version is rendered entirely with HTML elements and CSS style rules; JavaScript runs the game loop and supplies coordinates and state to CSS.
CSS transforms and math functions like hypot() and atan2() are used to determine wall width, rotation, and to compose positioned 3D objects.
Doom map data was compiled into a static scene of thousands of divs annotated with raw Doom coordinates; floors are rotated 90° around the X axis and clipped into polygon sectors.
Texture tiling is kept seamless by anchoring background positions in world coordinates, and movement is implemented by shifting the world rather than using a camera.



