Copy component
Copy component
How can I improve Framer Uni?
Let me know if there’s a missing feature or something that could be improved.
Share feedback
How can I improve Framer Uni?
Let me know if there’s a missing feature or something that could be improved.
Share feedback
New
New
New
Component
This is a text wave animation for Framer, inspired by one of the Apple dynamic island interactions showcased on Design Spells. It creates a smooth, flowing wave effect that animates across letters or words. Just copy and paste it into your project to start experimenting.
The text wave component allows you to customize how the wave affects your text. You can animate by each letter or word, control the wave’s width, and adjust the scale of the text at the center of the wave. The Origin option lets you choose whether the scaling starts from the bottom or center of the text, and Resize determines if surrounding text shifts when scaling occurs.
You can set the animation speed, loop it infinitely, and trigger it when the text appears in view, similar to Framer’s appear effects. A delay option is also available before the animation starts, and it applies between loops if enabled.
The text wave component allows you to customize how the wave affects your text. You can animate by each letter or word, control the wave’s width, and adjust the scale of the text at the center of the wave. The Origin option lets you choose whether the scaling starts from the bottom or center of the text, and Resize determines if surrounding text shifts when scaling occurs.
You can set the animation speed, loop it infinitely, and trigger it when the text appears in view, similar to Framer’s appear effects. A delay option is also available before the animation starts, and it applies between loops if enabled.
The text wave component allows you to customize how the wave affects your text. You can animate by each letter or word, control the wave’s width, and adjust the scale of the text at the center of the wave. The Origin option lets you choose whether the scaling starts from the bottom or center of the text, and Resize determines if surrounding text shifts when scaling occurs.
You can set the animation speed, loop it infinitely, and trigger it when the text appears in view, similar to Framer’s appear effects. A delay option is also available before the animation starts, and it applies between loops if enabled.
The text wave component properties in Framer.
The text wave component properties in Framer.
The text wave component properties in Framer.
Framer Navigator
Build your ideas with ease by learning the basics of website building with Framer.
Framer Navigator
Build your ideas with ease by learning the basics of website building with Framer.
Framer Navigator
Build your ideas with ease by learning the basics of website building with Framer.
