Last updated 23 August 2026
Blur vs spread
Blur softens the shadow's edge into a gradual fade. Spread changes the shadow's size before that blur is applied — positive spread makes it larger than the element, negative makes it smaller. Small blur with some spread gives a crisp, defined shadow; large blur with little spread gives a soft glow.
Common questions
What's the difference between blur and spread?
Blur softens the shadow's edge, making it fade out gradually. Spread grows or shrinks the shadow's size before blurring is applied — a positive spread makes the shadow bigger than the element itself.
What is glassmorphism?
A frosted-glass look made from a semi-transparent background, a background blur (backdrop-filter), and a subtle light border — popularized in iOS and modern web UI. It needs something visually busy behind it to actually show the blur effect.
Why does glassmorphism need -webkit-backdrop-filter too?
Safari historically required the -webkit- prefixed version of backdrop-filter to support it at all. Including both the standard and prefixed property is the safe way to support all major browsers.