# Countdown Timer

It’s time to turn *browsers* into *buyers* with a little help from Accentaute. 

The **Countdown Timer** is designed to help you create urgency and excitement on your storefront. In the fast-paced world of e-commerce, creating a sense of urgency can **significantly impact** your sales and conversions. 

This easy, no-code tool allows you to add dynamic, eye-catching **countdowns** to the **homepage** or any **product page** to drive **immediate shopper action**. Whether you’re promoting a limited-time sale, announcing a product launch or building anticipation for a new collection, the Countdown Timer lets you display a live, customizable timer directly on your Shopify store.

Ready to make every second count? Let's dive into how you can set up and leverage the Countdown Timer.

### Common use cases of the Countdown Timer

Here are some:

* **Flash Sales:** Display a live timer during limited-time discounts.
* **Product Launches:** Build anticipation with a countdown to a new collection or product release.
* **Restocks**: Let your customers know when their favorite items are coming back.
* **Event Promotion:** Count down to special upcoming store events or collaboration drops.
* **Holiday Promotions:** Add a festive countdown for occasions like Black Friday or Christmas.

### Set up your Countdown Timer

To find the Countdown Timer, follow these simple steps:

1. In your Shopify admin, go to **Online Store → Themes → Customize** 
2. Choose the page or section where you want the content to appear
3. Click **Add block / section →  Apps** and select **Countdown Timer**

<figure><img src="https://3940270179-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbIlmOfNwpXqPZMStJkgh%2Fuploads%2FXxbTRgZPrdSdGNKuPe6U%2FAccentuate_%2Bcountdown_1.png?alt=media&#x26;token=af8e7dc8-d4c6-4075-a1f6-28610ee6a1fb" alt=""><figcaption></figcaption></figure>

Once the block is added, you can customize its appearance and behavior in the Countdown Timer **settings panel** on the **right-hand side.** It’s divided into a few sections and we’ll cover what each one can do.

4. In the **Content** section, set your **Title**, **Subtitle** and **Target Date & Time**. Choose whether to **hide the timer** once it reaches zero or **show a message**.

<figure><img src="https://3940270179-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbIlmOfNwpXqPZMStJkgh%2Fuploads%2F0a0gLACWcDwzSILmcFHC%2FScreenshot%202025-10-23%20at%2016.57.14.png?alt=media&#x26;token=72cb46b2-e090-401a-a726-1b7130cd6daf" alt=""><figcaption></figcaption></figure>

5. In the **Colors** section, you can set a **background color** or upload a **background image** to make the timer stand out. Adjust how the image appears using **Image Position**, **Size**, and **Repeat** options.\
   \
   Finally, personalize the colors for your **text**, **Countdown Numbers** and **Timer Boxes** to match your store’s branding.

<figure><img src="https://3940270179-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbIlmOfNwpXqPZMStJkgh%2Fuploads%2F0k9VrGnYgl2cLRoJYS6e%2FScreenshot%202025-10-23%20at%2017.42.57.png?alt=media&#x26;token=6ba87a0a-2e9e-4c00-8f2b-a170e013bbfb" alt=""><figcaption></figcaption></figure>

6. In the **Layout** section, you can **Hide labels** to remove the text under each number. If you decide to **Disable Animations**, the countdown numbers will update smoothly without the jumping effect. Use the **Top** and **Bottom Padding** sliders to control the size of the banner.

<figure><img src="https://3940270179-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbIlmOfNwpXqPZMStJkgh%2Fuploads%2FlrjAhkIOL92iSZ6ciRrr%2FUntitled%20design%20(2).png?alt=media&#x26;token=0fc12c87-2e53-48ca-8fcb-defb3f9158a9" alt=""><figcaption></figcaption></figure>

7. In the **Typography** section, adjust the **Title** and **Number sizes**, as well as the **font weight**.
8. Click **Save.**

   <br>

<br>