Build Stunning Websites in minutes

Read the top, lose the rest

Eight backdrop-filter layers stack over this text, each masked to its own horizontal slice of the frame. The blur radius climbs from 0.5px on the first line to 16px on the last, so the paragraph dissolves gradually as your eye travels down rather than hitting one hard edge where a single blurred panel would start. Because every layer only blurs the slice its mask exposes, the falloff reads as a smooth ramp instead of eight visible bands. The grain in the gradient behind the text smooths out along exactly the same curve, which is the easiest way to see where each layer takes over. Drop this over an image, a long scrolling list, or a sticky header and the content underneath fades out of legibility on its own — no solid scrim needed, and whatever is behind it keeps its colour.