> For the complete documentation index, see [llms.txt](https://docs.rh-webdesign.com/cms-bundle/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.rh-webdesign.com/cms-bundle/en/elemente/inhalt-content/animierte-uberschrift.md).

# Animated Headline

The element adds a dynamic and eye-catching touch to your text headings. Animated effects visually highlight the text and draw more attention.

<figure><img src="https://118894700-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhdsmo3ttoHQpDlitXnzA%2Fuploads%2FTRqVDB2L87B3djITk6YR%2FBildschirmfoto%202024-10-07%20um%2022.07.10.png?alt=media&amp;token=40af0818-76b3-4976-b8e6-fe96800ecebe" alt=""><figcaption></figcaption></figure>

### General Settings

<figure><img src="https://118894700-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhdsmo3ttoHQpDlitXnzA%2Fuploads%2FrKb7QmfzJXLPckGbGf4b%2FBildschirmfoto%202024-10-07%20um%2022.08.18.png?alt=media&amp;token=803a4523-89d2-45b2-81c0-1e58d4a08571" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="261">Function</th><th>Description</th></tr></thead><tbody><tr><td>General Layout (1)</td><td><strong>Highlight</strong> = One word is animated<br><strong>Rotate</strong> = Multiple words are alternately faded in/out through animation</td></tr><tr><td>Animation Style (2)</td><td>Depending on what you set in (1), you have various animation options</td></tr><tr><td>Text Before the Teaser (3)</td><td>This is the text displayed <strong>before</strong> the animation block. This text is optional and can be left empty.</td></tr><tr><td>Highlight (4)</td><td>This text will be animated</td></tr><tr><td>Text After the Teaser (5)</td><td>This is the text displayed <strong>after</strong> the animation block. This text is optional and can be left empty.</td></tr></tbody></table>

### Advanced Settings

<figure><img src="https://118894700-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhdsmo3ttoHQpDlitXnzA%2Fuploads%2FUzloelTSPEKkNv5zQX8e%2FBildschirmfoto%202024-10-07%20um%2022.09.13.png?alt=media&amp;token=d0d1955f-2d49-4b30-8f1c-76e7d57920db" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="261">Function</th><th>Description</th></tr></thead><tbody><tr><td>Repeat Animation (1)</td><td>After the animation is complete, it automatically repeats in a loop</td></tr><tr><td>Duration (2)</td><td>Duration until the animation is completed</td></tr><tr><td>Delay (3)</td><td>Delay until the animation starts</td></tr></tbody></table>

### Layout Settings

<figure><img src="https://118894700-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fhdsmo3ttoHQpDlitXnzA%2Fuploads%2FhXeLAKDLxUH2Ve7nFEtx%2FBildschirmfoto%202024-10-07%20um%2022.09.56.png?alt=media&amp;token=1a61f667-3114-4219-b489-a6185f9a31b2" alt=""><figcaption></figcaption></figure>

### Responsive Settings

{% content-ref url="/pages/ZJ9dlvURdA2KvrRvb6W0" %}
[Font size](/cms-bundle/en/elemente/konfigurationsbausteine/schriftgrosse.md)
{% endcontent-ref %}

### SEO Settings

{% content-ref url="/pages/LHlzFdFr8hVLrftTJKPh" %}
[SEO](/cms-bundle/en/elemente/konfigurationsbausteine/seo.md)
{% endcontent-ref %}