Motion · Scroll & Layout
Scroll Reveal
Sections fade up once when they enter the viewport. Once only — scrolling back does not replay.
Specs#
| Trigger | whileInView, once, margin −40px |
| From | opacity 0, y 16px, blur 4px |
| Duration | 500ms |
| Easing | --ease-out |
| Built with | Motion |
Guidelines#
Use for
- Marketing pages, feature sections
- Images and long-form content
Avoid
- Product UI the user works in every day
- Hiding content until it animates — it must stay readable