Skip to content

Instantly share code, notes, and snippets.

@chadluo
Last active March 30, 2026 00:56
Show Gist options
  • Select an option

  • Save chadluo/d5d7782613dc864473f16fbc9cd8d1d4 to your computer and use it in GitHub Desktop.

Select an option

Save chadluo/d5d7782613dc864473f16fbc9cd8d1d4 to your computer and use it in GitHub Desktop.
shadows shouldn't stack

In computer UI shadows are typically implemented as a darken shape with blurred or half transparent edge. It's intiutive to add such shadows to every element, but when elements stack so do the shadows and they can get too dark.

Single window single shadow Many windows many shadows stacked
single - normal shadow multi - too much shadow

Shadows indicate absence of direct light, and if a material is not transparent, stacking it won't make it block even more light and make what's below it even darker.

You might take the union of all elements and apply a unified shadow, but still need to handle the 'element on element' shadow. 3DCG rendering pipelines should have mature solutions, and ray tracing should be even better, but they could be too expensive for such plain UIs.

It would be nice if there is a cheap and effective algorithm.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment