Six real faces
preserve-3d · translateZ · backface visibility
FRONT
BACK
RIGHT
LEFT
TOP
BOTTOM
NO CANVAS · NO WEBGL · JUST CSS
CSS3DPLAYGROUND
Perspective, depth, light, motion, hover and scroll—pushed until the browser starts feeling physical.
HOVER◆SCROLL◆WATCH◆TOUCH
Cursor-lit tilt
pointer coordinates · dynamic perspective · glare
Backface reveal
hover or focus · rotateY · two-sided content
Infinite cylinder
radial panel placement · rotateY · translateZ
01
02
03
04
05
06
07
08
09
10
Isometric city
rotateX · rotateZ · translated building heights
Depth tunnel
nested planes · translateZ · scale · autonomous camera
GO
Extruded type
layered shadows · skew · hover rotation
LOUD
PURE CSS TYPE DEPTHScroll explosion
view timeline · translateZ · scroll-linked rotation
01
02
03
04
05
06
07
Folded interface
transform origin · hinged panels · hover choreography
Motion path orbit
offset-path · offset-distance · automatic orientation
PATH()
Impossible staircase
perspective origin · repeated translate3d · optical illusion
Fan deck
nth-child transforms · hover spread · stacking order
Pressure button
active-state depth · inset shadow · physical travel
That was all DOM.
No model. No canvas.