Bring your typography to life with two powerful engines in one component: a smooth, scroll-triggered text reveal and the all-new Kinetic Mode. Create everything from a polished, cinematic reading experience to a living 3D installation.
––––––––––––––––––––––––––––––––––––––––––
Allowed: Use in personal websites and commercial client projects.
Not allowed: Including the component in templates for resale on any digital marketplace.
––––––––––––––––––––––––––––––––––––––––––
✨ Classic Scroll Reveal Uses a dynamic gradient mask to gradually fade text in or out as the user scrolls, perfectly timed with their position on the page.
Directional presets — choose from Bottom → Top, Top → Bottom, Left → Right, or Right → Left reveals.
Customizable fade edges — control how soft or sharp the reveal transition looks.
Responsive by default — fits your text height automatically, no manual sizing required.
6 Cinematic Effects — Enhance the reveal with Blur, Color Morph, Scramble (randomized characters), Typewriter (with a blinking caret), Kerning Tighten, and Chromatic Aberration (RGB ghosting).
🌀 Kinetic Mode (New!) Transform static text into a living 3D installation. Powered by a high-performance Canvas engine, Kinetic Mode breaks the grid, allowing letters to float, twist, and flow in real-time.
16 Spatial Paths: Explore complex geometries from classic Helixes to Mobius strips and fractals.
True 3D Depth: Adjustable FOV and Z-indexing create stunning atmospheric focus.
Echo Effects: Multi-layered motion trails for a sophisticated, multi-exposure aesthetic.
60 FPS Performance: Butter-smooth, scroll-independent animations with zero DOM overhead.
One toggle. Infinite motion.
Updates:
26.08.2025 - Added toggle "Repeat on Scroll"
6.10.2025 - Added diagonal directions
14.10.2025 - Added Offset From
23.10.2025 - Released v.2. Added Effects
24.05.2026 - Released v.3. Added: Kinetic Mode
27.05.2026 - You can add Image/Logo in Kinetic Mode
1.06.2026 - Added toggle "Disable Depth" for disable transparency of letters on backside.
Sabo Sugi
