CSS Units

Pixels. Fixed size, best for borders and shadows.

Relative to parent font-size. Compounds with nesting.

Relative to root font-size. Predictable scaling.

Relative to parent element size.

1% of viewport width. Great for responsive layouts.

1% of viewport height. Full-height sections.

1% of smaller viewport dimension.

1% of larger viewport dimension.

Width of the "0" character. Ideal for max-width on text.

Height of the "x" character in current font.

Centimeters. Only for print stylesheets.

Millimeters. Only for print stylesheets.

Inches. 1in = 96px. Print only.

Points. 1pt = 1/72 inch. Common in print.

Dynamic viewport height. Accounts for mobile browser bars.

Small viewport height. Smallest possible viewport.

Large viewport height. Largest possible viewport.

Container query inline size. For container queries.