# Text highlight

### Section Overview

The Text Highlight section creates interactive text that gradually reveals content as users scroll down the page, with words lighting up sequentially.

#### Common Use Cases

* Creating engaging storytelling experiences that capture user attention
* Highlighting key brand messaging or value propositions in a memorable way
* Building creative landing pages that reward scrolling behavior
* Showcasing testimonials or quotes with visual emphasis

#### Usage Tips

* Keep text concise for maximum impact - shorter content works best with this effect
* Consider using the sticky layout option for a fixed-position experience
* Use complementary colors that maintain legibility when words transition from faded to highlighted
* Test on mobile devices to ensure the scrolling experience is smooth across all viewports

### Section Settings

| Setting              | Description                                                                   |
| -------------------- | ----------------------------------------------------------------------------- |
| Top spacing          | Controls the amount of padding above the section (0-500px)                    |
| Bottom spacing       | Controls the amount of padding below the section (0-500px)                    |
| Color scheme         | Sets the background color of the section from theme presets                   |
| Custom color         | Defines a custom background color when "Custom" is selected                   |
| Text color           | Determines text color appearance (Default, Force light, Force dark)           |
| Border color         | Sets the color for any borders (Subtle, Strong)                               |
| Enable color fade    | Changes the background color of the page when scrolling to this section       |
| Border position      | Determines where borders appear (None, Top, Bottom, Top and bottom)           |
| Column width         | Controls the width of the content column (20-100%)                            |
| Horizontal alignment | Sets the horizontal alignment of section content (Left, Center, Right)        |
| Enable margin        | Applies horizontal margin from global theme settings when enabled             |
| Enable sticky layout | Makes the section stay fixed on screen while scrolling through content        |
| Visibility           | Controls when the section is visible (All devices, Mobile only, Desktop only) |

### Block Settings

#### Heading

A large heading that reveals words as the user scrolls.

| Setting              | Description                                                    |
| -------------------- | -------------------------------------------------------------- |
| Content              | The heading text that will be revealed word by word            |
| Horizontal alignment | Sets the text alignment within the block (Left, Center, Right) |

#### Content

Regular paragraph text that reveals words as the user scrolls.

| Setting              | Description                                                    |
| -------------------- | -------------------------------------------------------------- |
| Content              | The paragraph text that will be revealed word by word          |
| Horizontal alignment | Sets the text alignment within the block (Left, Center, Right) |

#### Buttons

Adds interactive buttons below the text content. Limited to 1 block per section.

| Setting                | Description                                        |
| ---------------------- | -------------------------------------------------- |
| Button label           | Text displayed on the primary button               |
| Button URL             | Destination link for the primary button            |
| Button color           | Styling preset for the primary button appearance   |
| Secondary button label | Text displayed on the secondary button             |
| Secondary button URL   | Destination link for the secondary button          |
| Secondary button color | Styling preset for the secondary button appearance |