> 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/discount-coupon.md).

# Discount coupon

Shows a promo code customers can use for a discount.

*Shared Settings*:

* [<mark style="color:$primary;">Discount coupon</mark>](#discount-coupon)
* [<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)
* [<mark style="color:$primary;">Discount coupon colors</mark>](#discount-coupon-colors)

*Shared Blocks:*

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

***

#### Discount coupon

**Apply code text**\
The text shown above the coupon code.

**Coupon Code**\
Enter the discount code that customers can use at checkout.

**Percentage**\
Sets the discount amount as a percentage (1-99% off).

**Heading**\
The main text used to introduce or highlight the coupon.

**End date**\
Use the field to paste a date when the coupon expires.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2F6L77LMEE92nhYL12WVkU%2Fdiscount%20coupon_settings.png?alt=media&amp;token=42ff7631-a08f-4ce7-b371-aa06b2173733" alt=""><figcaption></figcaption></figure>

***

#### Colors

**Heading**\
Applies to the heading.

**Accent**\
Controls the subheading color.

***

#### Discount coupon colors

**Background**\
Set the coupon code background color.

**Text**\
Controls the color of all text in the coupon code section.

**Accent**\
Adjusts the color of the icon and coupon code.

**Border**\
Accent color of the vertical line separator and border.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FYZN8BzBZpodi1MnmBUV5%2Fdiscount%20coupon_colors.png?alt=media&amp;token=cb9a035e-2d7f-439c-8531-d75f01f8926f" alt=""><figcaption></figcaption></figure>

***

{% tabs %}
{% tab title="Desktop" %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FU6WPVCJ7epRIxCOmAbvB%2Fdiscount%20coupon_desktop.png?alt=media&amp;token=f5f4f7a2-8b90-4dbf-b190-f2557d841d5c" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2Fcye7D5dWFSpSsLmloF9e%2Fdiscount%20coupon_mobile.png?alt=media&amp;token=485b5c9c-bf34-42fe-9049-77d7067f8bcb" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}
