> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/triumph/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/triumph/template/sections/call-to-action.md).

# Call to action

Encourages customers to take a specific action, like shopping or signing up.

*Shared Settings*:

* [<mark style="color:$primary;">Animation effect</mark>](#animation-effects)
* [<mark style="color:$primary;">Section layout</mark>](/triumph/template/shared-settings/section-layout.md)
* [<mark style="color:$primary;">Section mobile layout</mark>](/triumph/template/shared-settings/section-mobile-layout.md)
* [<mark style="color:$primary;">Divider line</mark>](/triumph/template/shared-settings/divider-line.md)
* [<mark style="color:$primary;">Background</mark>](/triumph/template/shared-settings/section-background.md)
* [<mark style="color:$primary;">Colors</mark>](#colors)

*Shared Blocks:*

* [<mark style="color:$primary;">Countdown</mark>](/triumph/template/shared-blocks/countdown.md)
* [<mark style="color:$primary;">Heading</mark>](/triumph/template/shared-blocks/heading.md)
* [<mark style="color:$primary;">Button</mark>](/triumph/template/shared-blocks/button.md)

***

**Link**\
Use the selector to redirect customers to a specific page when they click a banner or button.

**Direction**\
Changed the layout of the section.

* **Vertical** - Centers content.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FPGgsmcWMIrUiOpwhzgk3%2Fcall%20to%20action_vertical.png?alt=media&amp;token=a62838cf-7ee9-4cbf-ac40-97f260d7084b" alt=""><figcaption></figcaption></figure>

* **Horizontal** - Displays content in the full width of the section.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FaHXCeCLpAXZtOskllK8d%2Fcall%20to%20action_horizontal.png?alt=media&amp;token=c30e3f48-a0a8-4faa-b872-52100ff51643" alt=""><figcaption></figcaption></figure>

***

#### Animation effects

**Heading**\
Adds a subtle animation to the heading when it appears on the page.

**Pulse border**\
Creates a soft pulsing effect around the section to draw attention.\
*Note: This works only when the layout is set to a fixed width.*

**Button**\
Applies an animation effect to the button to make it more noticeable or interactive.

***

#### Colors

**Text**\
Controls the color of the main text.

**Subheading**\
Sets the color of the supporting text above the main heading.

**Icon**\
Changes the color of the icon next to the heading.

**Countdown background**\
Sets the background color of the countdown timer.

**Countdown text**\
Controls the color of the numbers and labels inside the countdown.

**Pulse border**\
Sets the color of the pulsing border effect.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FGdyiXVQKFnt8PaFDc9km%2Fcall%20to%20action_colors.png?alt=media&amp;token=6873f065-9e08-4898-b839-6163d628ab62" alt=""><figcaption></figcaption></figure>