Scroll · Moves as you scroll
Scroll quantized focus blur滚动分档失焦
- one paragraph at a time
- like a torch
- stepped
A block of text is pinned on screen; whichever paragraph you are on is sharp while the rest go soft. Scrolling down moves the focus one step at a time, like someone following your reading with a torch.
When to use it
Use it for long arguments, FAQs, terms, and step-by-step instructions — content where one paragraph at a time is right. Do not use it on tables and lists people compare back and forth; the blurred part is exactly what they need.
Parameters
progress < .2 → idx 0 · < .9 → idx 1 · else idx 3 · others opacity .05 + blur 5px · 300ms ease-out · stepped, not interpolated
Recipe
Scroll quantized focus blur → 300ms ease-outwhen progress < .2 → idx 0when < .9 → idx 1
One sentence for your AI
Turn this text into scroll-quantized focus: bucket the scroll progress into a few steps (for example two thresholds at .2 and .9 giving three buckets), drop the paragraphs outside the current bucket to opacity .05 with filter: blur(5px), and keep the current one at opacity 1 and blur 0, switching over 300ms ease-out. It is a stepped switch, not per-frame interpolation — there should be no in-between state.