ScrollFlowTextFX
ScrollFlow Text creates dynamic horizontal motion that reacts to scroll speed and direction, producing a smooth, looping marquee-style animation.
Made with Workshop
Build your own component with AI
About this Component
ScrollFlow Text adds kinetic energy to your designs by tying text movement to scrolling behavior. As users scroll, the text flows left or right, matching the scroll’s speed and direction for a natural, dynamic effect. You can adjust base velocity, loop copies, and responsiveness with damping and stiffness controls. The font, color, and animation mapping give full flexibility to match any layout. Ideal for headers, hero sections, or storytelling pages that respond to motion.
Properties
inputThe scroll value or progress that drives the animation. This represents the user’s scroll interaction and is mapped to the text’s movement.
outputThe resulting text position or offset value based on the input. This determines how far and in what direction the text moves in response to scrolling.
minThe minimum value of the input range. Defines the lower scroll boundary at which the text movement starts or reaches its minimum offset.
maxThe maximum value of the input range. Defines the upper scroll boundary where the text movement reaches its maximum offset or completes a full loop.
