Fade-up entrance
Also called: fade in up, reveal, slide up and fade in.
Content rises a short distance while it fades in. It's the most common way for sections to appear as you scroll.
The content rises 30px while it fades in. It's the most common entrance on the web.
Shown
Say it in a prompt
When the panel appears, fade it in and move it up 30px over 750ms with cubic-bezier(0.2, 0, 0, 1). Seen on
- Stripe: Content in the product window rises 30px and fades in over 0.75s.
You might describe it as
- text slides up a little while appearing
- fade in from below
- content floats up into place
Not to be confused with
- Pop in
A fade-up entrance rises from below; pop in grows in place.
- Page transition
A fade-up entrance is one part of a page appearing; a page transition moves from one whole page to the next.