Actions
Switch Theme
Getting startedInstallation
Basics
SocialsYouTube
Facebook
Jose Tamu
July 16, 2024 /  Beginner

SVG Reveal

SVG Reveal

Style

SVG Reveal is not a text node but an SVG so there are several controls to style it, including: fill, stroke color and stroke width.
Therefore, title dimensions are not auto and have to be set using width and height controls.

Animation controls

Duration
Delay

ScrollTrigger controls

SVG Reveal animation uses ScrollTrigger Library to fire on scroll. Learn more about ScrollTrigger here.
Start: determines the position of the SVG Reveal element to fire the animation. “top bottom” means when the top of the element hits the bottom of the viewport.
Replay on enter back: if enabled, the animation will replay each time the SVG Reveal element enters the viewport at the start position selected.

Additional Triggers

In case you need to fire the animation on additional events.
Trigger on: click or hover.
Element: the element that will fire the animation on the additional event selected.

– Tamu

On this page