> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/unicorn-shopify-theme/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/unicorn-shopify-theme/theme-settings/countdown-timer.md).

# Countdown timer

Show the Time countdown feature for a specific product in collections and product pages using settings from the current global section.

{% hint style="warning" %}
**Note!** The "Countdown timer" feature requires custom configurations in the admin using Metafields. Read the instructions on the following [<mark style="color:blue;">help page</mark>](/unicorn-shopify-theme/faq/how-to-customize-metafields.md#countdown-timer).
{% endhint %}

Once you have made all the changes in your admin, use  the described settings to display the sale countdown on the storefront:

### Product cards

**Show countdown timer**\
Activate the option to show the timer on product cards in collections. This option enables additional settings.

**Combine with discount badge**\
Displays a sale badge and countdown timer together in a single row on product cards across collection pages.

**Background / Text**\
Use the pickers to colorize the badge. The combination of the countdown timer and badge applies the color from *Theme settings ->* [*<mark style="color:blue;">Badges</mark>*](/unicorn-shopify-theme/theme-settings/badges.md) if you leave the items transparent.

<figure><img src="https://2943342198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FysL5Hr1ZCl3x5RHWgJ3m%2Fuploads%2FmXVWBzDRQIju1RwspAAw%2Fcountdown_product%20cards.png?alt=media&amp;token=96f95a42-f6cc-4b5b-8052-4a7a111dcabe" alt=""><figcaption></figcaption></figure>

***

### Product page and popup

**Show countdown units**\
The option displays days, hours, minutes, and seconds below the countdown in the dynamic "[<mark style="color:blue;">Countdown timer</mark>](/unicorn-shopify-theme/dynamic-theme-sections/countdown-timer.md)" section, the "[<mark style="color:blue;">Featured product</mark>](/unicorn-shopify-theme/dynamic-theme-sections/featured-product.md)" section, the "[<mark style="color:blue;">Popup</mark>](/unicorn-shopify-theme/dynamic-theme-sections/popup/countdown-timer.md)" section, and the "[<mark style="color:blue;">Countdown timer</mark>](/unicorn-shopify-theme/page-categories/products/product-details/countdown-timer.md)" block on product pages.

**Background /** **Border /** **Text**\
To change the default colors of the sale countdown in all the described sections, use the provided color pickers. Set the hex code for the corresponding color item, or use the paint palette.

<figure><img src="https://2943342198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FysL5Hr1ZCl3x5RHWgJ3m%2Fuploads%2FDJJ5UAU1re5Wi7lQb9Vr%2Fcountdown_product%20page%26popup.png?alt=media&amp;token=ed6bc7a5-9a00-4275-bb42-54dc2a4f6ccc" alt=""><figcaption></figcaption></figure>