luminosity.css: Directed element shadows and filter light source demo
main
element has the .light-source
class.
Edit the default parameters below to move the light source around to see how shadows are affected.
You can also edit the content of the divs themselves!
I'm a
#box
with text, lorem ipsum and so on.
This div has a weird
#shape
and wants an equally weird shadow 🤩
The box-shadow
property will honor the --border-radius
shape.
Without the
.light-effect
class, this #ghost
div is not affected by the light source.