# Tab 4 - GSAP Text Effects

The **Text Animations** tab lets you apply high-quality, performance-optimized **GSAP text animations** to elements on your website.

You can find this tab by clicking the **text icon** in the left vertical menu of the Aura Suite panel.

These animations are more flexible and significantly more performant than standard built-in Wix Editor animations, making them ideal for modern, motion-driven designs.

To understand how this works we recommend watching the following video:

{% embed url="<https://youtu.be/8VpbMzfqxk8>" %}

***

### What Makes These Animations Different?

Unlike simple preset animations, GSAP text animations allow:

* smooth staggered motion
* precise scroll control
* complex entrance and reveal effects
* reliable performance across browsers

This gives you much more control over how text appears and reacts while users scroll through your site.

***

### Types of Text Animations

Aura Suite offers three different animation types, depending on how you want the text to behave:

#### [1) Entrance Animations](/interactive-studio/aura-suite/get-started/tab-4-gsap-text-effects/entrance-animations.md)

Entrance animations play when the element enters the viewport.

They are great for:

* section headlines
* content reveals
* subtle motion while scrolling down the page

These animations trigger once and focus on visual flow.

#### [2) Scroll-Based Animations](/interactive-studio/aura-suite/get-started/tab-4-gsap-text-effects/scroll-animations.md)

Scroll-based animations stay linked to scroll position (depeding on the text element itsself).

Instead of playing once, the animation progresses as the user scrolls through the section.

These are ideal for:

* storytelling layouts
* long content sections
* step-by-step explanations

#### [3. Scroll-Based Animations with Trigger (Sticky Animations)](/interactive-studio/aura-suite/get-started/tab-4-gsap-text-effects/sticky-animations.md)

This mode is similar to regular scroll-based animations, but with one key difference:

* In **Scroll-Based Animations**, the **animated text element also acts as the trigger**.
* In **Scroll-Based Animations with Trigger**, the **animated element and the trigger element are separate**.

This is especially useful for layouts where the animation should be controlled by a different section or container - for example:

* sticky-position containers
* pinned sections
* scroll-storytelling layouts where text animates while another element controls the scroll progress

{% hint style="info" %}
**In short:** You animate one element, but you can choose a different element to control *when* and *how* the animation plays.
{% endhint %}

***

### Why These Are Explained in Separate Guides

GSAP text animations offer more flexibility, but they also require:

* correct section layout
* proper class assignment
* understanding of scroll behavior

Because of this, each animation type has its own detailed setup guide to make sure everything works smoothly.

***

### Continue with Detailed Guides

To learn how to set up each type of animation, continue with:

* [**Entrance  Animations  - Setup Guide**](/interactive-studio/aura-suite/get-started/tab-4-gsap-text-effects/entrance-animations.md)
* [**Scroll Animations - Setup Guide**](/interactive-studio/aura-suite/get-started/tab-4-gsap-text-effects/scroll-animations.md)
* [**Sticky  Animations - Setup Guide**](/interactive-studio/aura-suite/get-started/tab-4-gsap-text-effects/sticky-animations.md)

Each guide walks you through the full setup step by step.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://insync.gitbook.io/interactive-studio/aura-suite/get-started/tab-4-gsap-text-effects.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.