Zero units in CSS: duration, frequency, resolution require units

In most cases, the value zero does not require units to be specified in CSS, however, this is not the case when using non-length and non-angle units.

CSS doesn’t usually require zeros to have units — because zero is zero, regardless of units. Since these are all equivalent, the unitless version is often used:

  padding: 0px;  /* ✅ */
  padding: 0pt;  /* ✅ */
  padding: 0em;  /* ✅ */
  padding: 0rem; /* ✅ */

  padding: 0;    /* ✅ */

This works for all length-based units and angle-based units, but does not work other types of values. The CSS spec requires units to be specified for duration, frequency, and resolution values — even for zero.

Length units

Unit Zero (with unit) Zero (without unit)
em 0em 0
ex 0ex 0
ch 0ch 0
rem 0rem 0
vw 0vw 0
vh 0vh 0
vmin 0vmin 0
vmax 0vmax 0
cm 0cm 0
mm 0mm 0
Q 0Q 0
in 0in 0
pc 0pc 0
pt 0pt 0
px 0px 0

Angle units

Unit Zero (with unit) Zero (without unit)
deg 0deg 0
grad 0grad 0
rad 0rad 0
turn 0turn 0

Duration units

Unit Zero (with unit) Zero (without unit)
s 0s
ms 0ms

Frequency units

Unit Zero (with unit) Zero (without unit)
Hz 0Hz
kHz 0kHz

Resolution units

Unit Zero (with unit) Zero (without unit)
dpi 0dpi
dpcm 0dpcm
dppx 0dppx

This means that, although leaving units off a zero for transitions seems to be correct, it is in fact invalid:

  transition: opacity 0 ease;  /* ❌ */
  transition: opacity 0s ease; /* ✅ */

Quirky! For further reading, see CSS Values and Units Module Level 3, Sections 5 and 6.