Content

Animated Heading

A headline with a rotating or animated word.

Live demo

See it in action

Typewriter — types and deletes each word

We build websitesbrands, stores, ideas

Fade — words cross-fade

Designed for speedclarity, growth

Slide up — words slide in from below

Made for creatorsagencies, teams

Flip — words flip on the X axis

Build it fastersmarter, better

Zoom — words scale into view

Ship landing pagesportfolios, shops

Clip reveal — words wipe into view

Free and openflexible, yours

Word highlight — accent color (default)

Accent wordsphrases, ideas

Word highlight — underline

Underlined wordsphrases, ideas

Word highlight — marker background

Marker wordsphrases, ideas

Word highlight — none (inherits text color)

No accent on theseplain, words

The markup

Clean, lean code

This is the exact HTML the element outputs, straight from the page builder. No wrapper soup, no inline-style bloat.

<section class="fw-flexbox fw-flex fw-contained fw-collapse">
	<h2 class="animated-heading ah-c612a8bd fw-ah fw-ah--anim-typewriter fw-ah--speed-normal fw-ah--hl-color text-center" data-ah-words="[&quot;websites&quot;,&quot;brands&quot;,&quot;ideas&quot;]" data-ah-loop="forever"><span class="fw-ah__static">We build </span><span class="fw-ah__rotate"><span class="fw-ah__word">websites</span><span class="fw-ah__caret fw-ah__caret--bar" aria-hidden="true"></span></span><span class="screen-reader-text">brands, ideas</span></h2>
</section>

To learn more about the Animated Heading shortcode, please check out the online manual here.