Ambient CSS

A physics-based lighting system for CSS: define a light source, and every shadow, highlight and surface gradient follows from it — calibrated against Blender raytraces.

Included Components

8
Light Source ControllerTactile Rotary KnobsTactile Push ButtonsSegmented Rocker SwitchesSmooth Toggle SlidersNeumorphic Display PanelConvex & Concave SurfacesSurface Elevation Bevels

Ambient CSS replaces hand-tuned shadow systems (like shadow-sm / shadow-md / shadow-lg) with a unified, physics-grounded lighting model. By declaring a single light source position, elevation, and intensity, all downstream UI components compute accurate drop shadows, inner ambient shadows, specular highlights, and surface gradient angles in real time. The mathematical models are calibrated against raytraced Blender reference renders and execute with zero JavaScript runtime using pure CSS custom properties.