# Countdown bar

<figure><img src="https://2841038207-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGTidUfSjAqopf8pRRmN%2Fuploads%2FmzneVukMaWVYipAbtHLq%2F2025-04-04_12-34-19.jpg?alt=media&#x26;token=771b2a66-065a-4c6e-bea6-3781af8557cb" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
**Steps:**&#x20;

1. In the theme editor **(Customize)**, click **Add section.**
2. Locate **Countdown bar**
3. Make necessary changes. > **Save.**
   {% endhint %}

## General settings

<figure><img src="https://2841038207-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGTidUfSjAqopf8pRRmN%2Fuploads%2FqzFlJBgcyKAX2EzXowUh%2F2025-04-04_12-34-46.jpg?alt=media&#x26;token=93d63f4f-c087-4379-a9c9-c3b2e05a18c3" alt=""><figcaption></figcaption></figure>

* **Width** - With of this section 3 options : Boxed / Wide / Full
* **Background image**

### Countdown

<figure><img src="https://2841038207-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGTidUfSjAqopf8pRRmN%2Fuploads%2FxvNTpxHenGAW8DhG5nJI%2F2025-04-04_12-35-28.jpg?alt=media&#x26;token=69df946d-01d0-44b9-8e9a-48c07d7f70ec" alt=""><figcaption></figcaption></figure>

* **End time** -  Date format: YYYY/MM/DD HH:MM:SS
* **Style** - Hightlight / Simple / Outline
* **Font family** - Body / Heading
* **Number size** - from Heading 1 to Heading 6
* **Text type** - Long / Short

### Content

<figure><img src="https://2841038207-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGTidUfSjAqopf8pRRmN%2Fuploads%2F6WcD4zSeS4jQjMDa1X0J%2F2025-04-04_12-36-12.jpg?alt=media&#x26;token=90e0a911-1345-4bc3-9e65-8e32e97cf752" alt=""><figcaption></figcaption></figure>

* **Subheading**
* **Heading**
* **Heading size**
* **Content**
* **Button** - Leave the label blank to hide the button.
* **Button link**
* **Button style**
* **Show arrow icon**

### Colors

<figure><img src="https://2841038207-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGTidUfSjAqopf8pRRmN%2Fuploads%2FrHNfKaaASnRkShX5D08z%2F2025-04-04_12-38-40.jpg?alt=media&#x26;token=cade1c91-f2ac-44ff-9c4d-5aad9262a664" alt=""><figcaption></figcaption></figure>

* **Background**
* **Text color**
* **Border**&#x20;
* **Overlay color**
* **Overlay opacity**
* **Overlay gradient**

### Section padding

<figure><img src="https://content.gitbook.com/content/IGTidUfSjAqopf8pRRmN/blobs/n2xL6bjz1tYl76g1pebr/padding-c.jpg" alt="" width="280"><figcaption></figcaption></figure>

* **Top padding**
* **Bottom padding**