Hacker News new | past | comments | ask | show | jobs | submit login

> If CSS had a real lighting system, we would specify a position for one or more lights. Sadly, CSS has no such thing.

Are there any post processing libraries that can add this? It would be super interesting to treat elements on the page in 3 dimensions

That's a good point. Could largely be achieved using a combination of design tokens to indicate light source, and an abstraction that allows assigning an elevation value (much like in Material Design) to individual elements.

Arguably what's missing is the ability to use blend modes with shadows, so that you don't need to explicitly know anything about the elements that the shadows are rendered on.

Edit: Found a Stackoverflow answer that shows a way to somewhat emulate this using a pseudo element: https://stackoverflow.com/questions/52838406/apply-blend-mod...

I threw together a crude implementation of a pure CSS lighting system if you're interested: https://github.com/kinseywk/zShadows/blob/gh-pages/index.md

That's all I could think about while reading this!

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact