Animated Heading

Animated Heading combines fixed text with a sequence of changing words or phrases. Use it for a short headline whose variations remain understandable in the same sentence.

Add and configure Animated Heading

1. Click Add, choose Animated Heading, and place it in the container.
2. Set Before Text, populate Changing Text, and set After Text under Content > Content.
3. Choose Tag for the heading level.
4. Configure Design > Effect, Size, and Typography.
5. Save your changes.

This element has no children; use its own controls.

Controls

Responsive varies by breakpoint; Hover has a hover value; Shared applies across both. Linked controls have their own reference. In conditions, = means “is” and ≠ means “is not.”

Content > Content

Setting	Purpose and options	Behavior
Before Text	Enter the before text.	Shared
Changing Text	Add, edit, remove, and reorder changing text. When: Type ≠ annotation.	Shared
Changing Text > Text	Visible text. When: Type ≠ annotation.	Shared
After Text	Enter the after text.	Shared
Tag	h1, h2, h3, h4, h5, h6.	Shared

Design > Effect

Setting	Purpose and options	Behavior
Type	Typing, Rotating.	Shared

Shown when Type = Typing.

Setting	Purpose and options	Behavior
Typing > Type Speed	Type speed and unit.	Shared
Typing > Start Delay	Start delay and unit.	Shared
Typing > Back Speed	Back speed and unit.	Shared
Typing > Back Delay	Back delay and unit.	Shared
Typing > Shuffle	On/off.	Shared
Typing > Disable Loop	On/off.	Shared
Typing > Hide Cursor	On/off.	Shared

Setting	Purpose and options	Behavior
Typing > Cursor	Enter the cursor. When: Type = Typing and Hide Cursor is unset.	Shared

Shown when Type = Typing.

Setting	Purpose and options	Behavior
Typing > Cursor Style	typography controls.	See linked controls
Typing > Typography	typography controls.	See linked controls
Typing > Background	Color or supported fill.	Shared
Typing > Spacing	spacing controls.	See linked controls

Shown when Type = Rotating.

Setting	Purpose and options	Behavior
Rotating > Duration	Duration and unit.	Shared
Rotating > Delay	Delay and unit.	Shared
Rotating > Easing In	easeOutSine, easeOutExpo, easeOutBack, easeOutBounce.	Shared
Rotating > Easing Out	easeInSine, easeInExpo, easeInBack, easeInBounce.	Shared
Rotating > Transform origin	Set transform origin.	Shared

Setting	Purpose and options	Behavior
Rotating > Effect	Slide down, Slide right, Slide up, Slide left, Rotate, Flip x, Flip y, Zoom in, Zoom out. When: Type = Rotating and Type = Rotating.	Shared
Rotating > Background	Color or supported fill. When: Type = Rotating.	Shared
Rotating > Spacing	spacing controls. When: Type = Rotating.	See linked controls

Design > Size

Setting	Purpose and options	Behavior
Width	Width.	Responsive

Design > Typography

Setting	Purpose and options	Behavior
Typography	typography controls.	See linked controls

Design > Spacing

Setting	Purpose and options	Behavior
Spacing	spacing controls.	See linked controls

Troubleshooting