component
Scroll Morph Text
By Aidan Looker
Details
- Aidan LookerAuthor
- componentType
- $6.00Price
- 2026-04-08Published
- 2026-06-13Updated
- 2026-03-27Added
- TextCategories
Summary
What is Scroll Morph Text?
Description
What is Scroll Morph Text? Scroll Morph Text is a scroll-driven content component that presents feature highlights, value propositions, or process steps one at a time in a sticky, full-viewport layout. As the user scrolls, each item morphs into view with a cinematic word-by-word blur and fade cascade, then smoothly transitions to the next. Ideal for landing pages, feature tours, about sections, and product showcases. Core Features Word-by-word blur reveal animation with customisable blur intensity, stagger, and speed Gradient-highlighted keyword per item with configurable start and end colours Inline SVG icons per item, selectable from 9 built-in options including Lightning, Rocket, Shield, and Code Scroll-driven progress line that grows smoothly between items Step counter with Fraction or Dots format Sequential fade timing across icon, counter, tag, title, and body for a natural reveal Premium hover micro-animations on title words and gradient words with lift, glow, and scale effects Center or left text alignment Custom font support via Framer Font control Controls inside Framer Items Tag label Title text Body text Icon (None, Lightning, Paintbrush, Rocket, Shield, Puzzle, Globe, Star, Heart, Code) Gradient Word index Layout Alignment (Center / Left) Scroll Speed Counter Show / Hide toggle Format (Fraction / Dots) Animation Blur amount Stagger delay Speed Colors Title Body Tag Accent Counter Gradient Start Gradient End Typography Font family and weight Best use cases SaaS and startup landing pages to present core features with a premium scroll experience Agency portfolios and case study pages to guide visitors through key highlights Product launch pages to build anticipation with sequential, cinematic reveals About and mission pages to walk users through company values or process steps Replace static feature grids with an interactive scroll experience that keeps visitors engaged and reinforces a premium brand impression. Questions or custom requests? We design and build custom Framer components. Get in touch at contact@teampixel.com.au
Introduction
Scroll-driven text morphing with blur.
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #6522