Now Live

Visual Configurators Available — New Animated Elements Coming June 30th Animations June 30th

Get Started
Morphing Text Configurator

How to Use in Breakdance Builder

  1. Customize your morphing text effect using the controls below
  2. Click the Get Code button and copy the JavaScript
  3. In Breakdance Builder, add a Code element and paste the JavaScript
  4. Add the attribute
    data-morphing-text📋
    with value "true" to any container element
This tool creates a custom script with your settings built-in. You only need to add the data attribute with value "true" to implement your morphing text effect!
Container Placement: The text will be perfectly centered regardless of the container's dimensions. For best results, add the attribute to a container with a defined width and height, like a Div or Section element.
Breakfusion Exclusive Get Your Morphing Text Effect

Add a captivating morphing text animation to your website with this custom-crafted JavaScript snippet.

  • Easy implementation with simple data attributes
  • Smooth liquid text transitions
  • Fully responsive and mobile-friendly
  • Customizable animation speed and styling
Text Content
Text Items
+ Add Text
Animation Settings
Morph Time 1.5s

Duration of the morphing animation between text items

Cooldown Time 0.5s

Wait time before starting the next animation

Text Style
Font Size 40px
Font Weight
Line Height 1.2
Text Color
Text Alignment

JavaScript Code