# Countdown Banner

> Create urgency that converts — add a sleek countdown banner to your promotions and watch shoppers act before time runs out.

URL: https://sectionstar.app/sections/count-down-banner/
Source: Section Star — https://sectionstar.app
Updated: 2026-10-26T00:00:21.889Z

---

**Countdown Banner** is a Shopify theme section in the Section Star library. Create urgency that converts — add a sleek countdown banner to your promotions and watch shoppers act before time runs out.

## About the Countdown Banner section

The Count Down Banner section is designed to create a dynamic and engaging countdown timer on your Shopify store. It can be used to highlight sales, promotions, or any event that requires a countdown. The section is fully customizable with options for font styles, icon choices, colors, and more.

## Live demo

## Use cases

1. **Flash Sales**: Create urgency for your customers by highlighting limited-time flash sales.
  
2. **New Product Launch**: Build anticipation for a new product launch by counting down to the exact launch time.
  
3. **Seasonal Discounts**: Use the countdown banner to promote seasonal discounts such as Black Friday, Cyber Monday, or Christmas sales.
  
4. **Event Countdown**: Perfect for highlighting upcoming events like webinars, special announcements, or any event where a countdown could increase engagement.

5. **Limited Stock Notification**: Inform customers of limited stock availability or an offer that expires soon.

## Settings

Every setting below appears in the Shopify theme customizer once the section is published.

### Font
Set the fonts for your section

| Setting | Type | Default |
| --- | --- | --- |
| Override theme fonts | Checkbox | Off |
| Text Font | Font | sans-serif |
| Timer Font | Font | sans-serif |
| Override text sizes | Checkbox | On |
| Text Size | Range | 15 |
| Timer Size | Range | 15 |

### Text Colors
| Setting | Type | Default |
| --- | --- | --- |
| Text Color | Color | #fff |
| Timer Color | Color | #111 |
| Link Color | Color | #005bd3 |
| Underline Link? | Checkbox | On |

### Banner Colors
| Setting | Type | Default |
| --- | --- | --- |
| Background Color | Color or gradient | linear-gradient(164deg, #111 0%, #222… |
| Countdown Background Color | Color or gradient | linear-gradient(164deg, #fff 0%, #fff… |

### Grid Design
| Setting | Type | Default |
| --- | --- | --- |
| Grid Spacing | Number | 10 |

### Section Design
Set the design for the section

| Setting | Type | Default |
| --- | --- | --- |
| Show Section | Select (All Devices, Mobile Only, Desktop Only) | all |
| Max Width of Section | Number | 1000 |
| Padding Top | Number | 25 |
| Padding Bottom | Number | 25 |
| Padding Left | Number | 10 |
| Padding Right | Number | 10 |

### End Date
Set the end date to count down to.

| Setting | Type | Default |
| --- | --- | --- |
| End Month | Select (January, February, March, April, May, June…) | 01 |
| Day | Range | 1 |
| Year | Select (This Year, Next Year) | 0 |
| Hour | Select (00 (12AM), 01 (1AM), 02 (2AM), 03 (3AM), 04 (4AM), 05 (5AM)…) | 00 |
| Minute | Select (00, 15, 30, 45) | 00 |
| Timezone | Select (UTC-12 (AoE), UTC-11 (NUT), UTC-10 (HST), UTC-9 (AKST), UTC-8 (PST), UTC-7 (MST)…) | Z |

### Countdown Design
Set the display of the countdown timer

| Setting | Type | Default |
| --- | --- | --- |
| Days Text | Text | days |
| Hide days? | Checkbox | Off |
| Hours Text | Text | hours |
| Minutes Text | Text | mins |
| Seconds Text | Text | seconds |
| Hide seconds? | Checkbox | Off |

### Icon Display
| Setting | Type | Default |
| --- | --- | --- |
| Icon Size | Range | 30 |
| Icon Color | Color | #0D8BF4 |
| Icon | Select (No Icon, Cart, Gift, Gift Card, Shipping, Payment…) | tag |

### Content
Set the content for section

| Setting | Type | Default |
| --- | --- | --- |
| Text Alignment | Select (Left, Center, Right) | left |
| Mobile Text Alignment | Select (Left, Center, Right) | left |
| Countdown Alignment | Select (Left, Center, Right) | right |
| Mobile Countdown Alignment | Select (Left, Center, Right) | left |
| Content | Inline rich text | This is the sample banner text |
