Sticky Text Reveal

Static text, dynamic reveal.

Setup: Place this component inside a sticky stack . (Recommendations Below) Configure settings: Text , Color , Reveal Type , and Reveal Mode Done! Features Three Reveal Styles → Highlight, Mask, or Fade In Reveal Modes → Animate by letter, word, or line Blur Effect → Add subtle blur for extra style Embedded Link → Turn any word in the display text into a clickable hyperlink. HTML Tag Support → Choose semantic tags (p, h1, etc.) for accessibility Controls: Delay → Default: 0vh . At 0vh, the animation starts instantly. Increasing this value (e.g., 100vh) means the animation will begin only after that amount of scroll distance. Duration → Default: 100vh . This defines how long the animation takes. At 100vh, the reveal completes over 100vh of scroll distance. Disappear → Default: No . When set to Yes , the text will disappear as you continue scrolling after it has been revealed. Same as Reveal but in reverse. This component uses Framer’s Sticky Scroll feature. It requires two stacks: Container Stack Height: 2 00vh or more Position: Relative Sticky Stack Height: exactly 100vh Position: Sticky These Height values are not mandatory. You can try other Height values according to your need. Once set, the sticky stack behaves like a regular section. Sticky Scroll Setup Learn More: Search on YouTube: “Sticky scroll Framer”, or Detailed Tutorial: Framer University – Sticky Scroll

Static text, dynamic reveal.