The Physics of Light: Virtual Sunlight & Ambient Occlusion
In digital interface design, shadows simulate a virtual physical environment governed by consistent optical rules:
Virtual Light Source: By universal convention in UI systems, the primary light source is positioned above and slightly in front of the screen. Light casts downwards, making positive Y-offsets standard.
Direct Shadow vs. Ambient Occlusion:
Direct Cast Shadow: Directional shadow cast along the light angle (sharp, offset downwards).
Ambient Occlusion: Soft, diffuse darkness that settles where two physical surfaces meet or sit in close proximity, independent of light angle.
Top-tier design systems layer both components together for realistic physical depth.
Topics
The Physics of Light: Virtual Sunlight & Ambient Occlusion
Deconstructing CSS Box-Shadow Properties
Layered Shadows: Avoiding the Muddy Black Anti-Pattern
Elevation Hierarchy and Design System Tokens
Shadows in Dark Mode: Tonal Elevation vs. Opacity
Cognitive Affordance: Communicating Interactivity and Drag States