Twelve designs, each drawn in the picker at the size it will be:

Design	What it is
Blocks	Four solid tiles in the accent colour. The default.
Plain	Numbers only, in your theme's own type.
Outline	The same tiles, drawn rather than filled.
Pill	One rounded strip holding the whole clock.
Digital	A dark panel, like a digital clock. The numbers hold their place as they change.
Rings	Each unit drains a ring as it counts down.
Flip	Split tiles with a seam across the middle.
Ribbon	A full-width band. Made for the top of the site.
Panel	One bordered card holding the heading, the clock and the button.
Stack	The units one under another, separated by lines.
Underline	Numbers sitting on a thick line, with no box around them.
Stripe	A tinted band with a thick line down one edge.

Panel is the one to reach for on a product page when the timer should read as one object rather than a loose heading, clock and button. Stack is the only design that is taller than it is wide, which makes it the safe answer for a narrow sidebar or a column that runs out of room sideways. Underline and Stripe are the quiet ones: Underline draws a single firm baseline under the figures and nothing else; Stripe is the shape a note takes in print, and sits above post content without shouting.

The picker works from the keyboard like any group of options: Tab into it, and the arrow keys move between the designs, with a ring round the one that has focus.

Under it: which units to show, whether they are labelled in full, abbreviated or not at all, the size, the alignment, and three colours. Leave Text empty to use your theme's own text colour; the heading and the unit labels are that colour faded, so they follow it wherever it goes. Background is used by the Outline, Pill, Rings, Panel and Stripe designs and by the top bar, and is white when left empty — those designs need a solid colour to draw with. Text drawn on that background (the figures inside the Rings, the top bar, the Panel card and the Stripe band) stays near-black when Text is empty, so it can be read on the white; on a dark theme, set Background and Text together.

Text is kept readable whatever Accent you choose, on every design. The Blocks and Ribbon designs draw their figures, labels and heading on the accent in white while white can be read there (4.5:1, the WCAG AA level), and in near-black when it cannot — a sale amber gets dark figures instead of white ones at 2:1. On the few mid-tones where neither reaches 4.5:1, such as #E53935, they are black. The Digital readout lightens the accent just far enough to read on its black. The Plain, Outline, Pill, Panel, Stack and Stripe designs draw the figures in the accent itself, and where that cannot be read on the background behind it the accent is walked towards black — or towards white on a dark background — until it can. An accent that already reads is used exactly as you chose it, which is why the default red is untouched.

With Dark Mode by Traslatability switched on, the Ribbon keeps its colours as you chose them, its button included, so the band and its link look as they do in light mode. The other designs sit on the page and are re-coloured with it.

Hiding a unit does not lose its time. A timer set to hours and minutes on a three-day sale reads seventy-seven hours, not five.

How it looks