# Countdown

### Section overview

The Countdown section displays a countdown timer for limited-time offers or promotions, with customizable content and an optional image.

#### Common use cases

* Showcasing time-limited promotions or sales
* Announcing upcoming product launches or events
* Creating urgency for special offers
* Highlighting seasonal campaigns with end dates

#### Usage tips

* Set a realistic and accurate countdown date in the proper format (MM/DD/YYYY)
* Pair the countdown with clear, compelling content explaining the offer
* Consider mobile users by adjusting block widths appropriately for different devices
* Use color schemes that align with your brand while ensuring text remains legible

### Section settings

| Setting              | Description                                                  |
| -------------------- | ------------------------------------------------------------ |
| Countdown date       | The target date for the countdown timer (format: MM/DD/YYYY) |
| Top spacing          | Controls the padding space above the section (0-300px)       |
| Bottom spacing       | Controls the padding space below the section (0-300px)       |
| Color scheme         | Choose from preset color themes or select custom             |
| Custom color         | Define a custom background color when "custom" is selected   |
| Text color           | Choose default, force light, or force dark text              |
| Border color         | Select subtle or strong border colors                        |
| Button color         | Choose from various button styles (primary, secondary, etc.) |
| Enable color fade    | Enables smooth color transitions when scrolling              |
| Border position      | Choose where borders appear (none, top, bottom, or both)     |
| Vertical alignment   | Controls how blocks align vertically (top, middle, bottom)   |
| Horizontal alignment | Controls how blocks align horizontally (left, center, right) |
| Enable margin        | Toggles margin around the section content                    |
| Visibility           | Controls section visibility across device types              |

### Block settings

#### Countdown

The primary block that displays the countdown timer along with optional heading, content, and call-to-action button.

Block limit: 1

| Setting              | Description                                                       |
| -------------------- | ----------------------------------------------------------------- |
| Heading              | Title text displayed above the countdown                          |
| Content              | Rich text content to describe the offer or promotion              |
| Button label         | Text displayed on the call-to-action button                       |
| Button url           | Link destination when button is clicked                           |
| Desktop width        | Controls block width on desktop devices (1/12 to 12/12)           |
| Mobile width         | Controls block width on mobile devices (1/12 to 12/12)            |
| Horizontal alignment | Controls content alignment within the block (left, center, right) |

#### Image

An optional visual element to accompany the countdown timer.

Block limit: 1

| Setting       | Description                                             |
| ------------- | ------------------------------------------------------- |
| Image         | The image to display alongside the countdown content    |
| Desktop width | Controls image width on desktop devices (1/12 to 12/12) |
| Mobile width  | Controls image width on mobile devices (1/12 to 12/12)  |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.brickspacelab.com/space/sections/content-and-media/countdown.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.