Sticky Text Reveal — Static text, dynamic reveal.

Setup:

• Place this component inside a sticky section.

  Container Stack → Height: 300vh, Position: Relative

  Sticky Stack → Height: 100vh, Position: Sticky

• Configure settings: Text, Color(s), Reveal Type, and Reveal Mode

• Done!Note: Adjust the Container Stack height if you change Reveal Speed. For example, if Reveal Speed is set to 2, reduce Container Stack height to 200vh.

# Sticky Section Setup (Framer)

This component uses Framer’s Sticky Scroll feature. It requires two stacks:

1. Container Stack

   • Height: 300vh

   • Position: Relative

2. Sticky Stack

   • Height: exactly 100vh

   • Position: Sticky

Once set, the sticky stack behaves like a regular section.

Learn More:

• Search on YouTube: “Sticky scroll Framer”, or

• Detailed Tutorial: Framer University – Sticky Scroll

Features

• Three Reveal Styles → Highlight, Mask, or Fade In

• Reveal Modes → Animate by letter, word, or line

• Reveal Speed Control → Adjust how fast the text appears

• Blur Effect → Add subtle blur for extra style

• HTML Tag Support → Choose semantic tags (p, h1, etc.) for accessibility

• Easy Setup → Drop in place of regular text, no extra configuration needed