Countdown block
A countdown timer showing the days, hours, minutes and seconds left until a date.
Timer
| Setting | Description |
|---|---|
| End date | Date and time the countdown counts down to. Example: Dec 31, 2030 or Dec 31, 2030 20:00. Default: Dec 31, 2026. |
| Timer behavior | What happens when the timer ends: Stop and show zeros, Restart when finished (cycle) or Hide when finished. Default: Restart when finished (cycle). |
| Cycle hours | Length of each repeated cycle. Available only when the timer restarts. Range: 1–48 h, step 0.5. Default: 2.5 h. |
| Days text | Word shown under the days number. Default: Days. |
| Hours text | Word shown under the hours number. Default: Hours. |
| Minutes text | Word shown under the minutes number. Default: Minutes. |
| Seconds text | Word shown under the seconds number. Default: Seconds. |
Typography
| Setting | Description |
|---|---|
| Numbers size | Size of the timer numbers on desktop. Range: 14–56 px. Default: 32 px. |
| Numbers size mobile | Size of the timer numbers on mobile. Range: 14–56 px. Default: 24 px. |
| Numbers font family | Font of the numbers: Heading large, Heading small, Body or Accent. Default: Body. |
| Numbers color | Color of the numbers: Heading, Text or Accent. Default: Text. |
| Text size | Size of the unit texts (Days, Hours and so on) on desktop. Range: 10–32 px. Default: 14 px. |
| Text size mobile | Size of the unit texts on mobile. Range: 10–32 px. Default: 12 px. |
| Text font family | Font of the unit texts: Heading large, Heading small, Body or Accent. Default: Accent. |
| Text color | Color of the unit texts: Heading, Text or Accent. Default: Text. |
Padding
| Setting | Description |
|---|---|
| Top, Bottom, Left, Right | Space around the timer on desktop. Range: 0–100 px, step 1. Default: 0 px. |
| Top mobile, Bottom mobile, Left mobile, Right mobile | Space around the timer on mobile. Range: 0–100 px, step 1. Default: 0 px. |