The unseen detail

Most counters jitter when their numbers tick over. Nobody can name why — it just feels a little off. The fix is two Tailwind utilities most developers skip.

Horizontal jitter

tabular-nums forces every digit to take the same horizontal space. Without it, proportional figures kick in — 1 is narrower than 0, so 11:11 sits visibly tighter than 00:00. The cells breathe as the counter ticks. You don't see it; you feel it.

Vertical jitter

lining-nums locks all digits to the baseline at uniform height. Most fonts default to lining figures, but some — especially serif and humanist sans — ship with oldstyle as the default, where 3, 5, 7, 9 dip below the line. Defensive code beats hopeful code.

The combo

<span class="tabular-nums lining-nums">
  {value}
</span>

Two classes. Both axes locked. The kind of fix that turns a counter from okay to you don't even notice it.

Most details users never consciously notice — and that's the point. The aggregate of invisible correctness is what makes software feel right.