Timer style — Basic vs Block
Choose whether each digit sits plainly or inside its own styled block.
Timer Style controls how the digits themselves are presented. It's on the Design tab.
When the card isn't there
The Timer Style card is hidden in two cases: on cart page timers, whose countdown renders inline inside the title, and when the Compact Purple template is selected, since that template defines its own digit presentation.
The two styles
| Style | What it looks like |
|---|---|
| Basic | Digits sit directly on the timer background with no container |
| Block | Each unit gets its own box, with a background, border, corners, and padding you control |
Set the style
Open the timer and go to the Design tab.
Find the Timer Style card.
Choose Basic or Block.
Click Save.
Block style settings
Selecting Block reveals a set of controls for the digit boxes:
| Setting | What it does |
|---|---|
| Corner radius | Rounds each block's corners |
| Block Background Color | The fill behind each unit |
| Border size | Thickness of the block border |
| Border color | Color of the block border |
| Vertical padding | Space above and below the digits inside the block |
| Horizontal padding | Space left and right of the digits inside the block |
Set Timer Style to Block.
Set Block Background Color — usually a shade that contrasts with the timer background.
Set Corner radius. 4–8 reads as subtle, 12+ as distinctly rounded.
Adjust Vertical padding and Horizontal padding until the digits sit comfortably.
Click Save.
Which to use
- Basic when the timer sits inside an already-styled bar or card, where extra boxes would look busy
- Block when the timer needs to read as its own component — on a product page, or over a background image where plain digits would get lost
Tip
Block style with a contrasting background is the most legible option over a background image. Plain digits on a photo are hard to read no matter what color you pick.