CSS font-size


The CSS font-size property is used for specifying the size of a font.

You can specify the font size as an absolute size, relative size, length, or percentage. See below.


font-size: <value>

Possible Values

Absolute Sizes:
  • xx-small
  • x-small
  • small
  • medium
  • large
  • x-large
  • xx-large
Relative Sizes:
  • larger
  • smaller
  • An absolute font size (independent of the user agent's font table). Negative lengths are illegal.
  • An absolute font size relative to the parent element's font size.

In addition, all CSS properties also accept the following CSS-wide keyword values as the sole component of their property value:

Represents the value specified as the property's initial value.
Represents the computed value of the property on the element's parent.
This value acts as either inherit or initial, depending on whether the property is inherited or not. In other words, it sets all properties to their parent value if they are inheritable or to their initial value if not inheritable.


Initial Value
Applies To
All elements
Yes (the computed value)
Yes (see example)

Example Code

h1 { 
  font-size: 24px; 
p { 
  font-size: 1em; 
blockquote { 
  font-size: 120%; 
nav { 
  font-size: smaller; 

Absolute-Size Reference

Here's a rough guide as to mappings between CSS absolute sizes and HTML heading and absolute font sizes.

Note that the actual value may vary, depending on the value of font-size-adjust, and the unavailability of certain font sizes.

CSS absolute-size values xx-small x-small small medium large x-large xx-large
scaling factor 3/5 3/4 8/9 1 6/5 3/2 2/1 3/1
HTML headings h6 h5 h4 h3 h2 h1
HTML font sizes 1 2 3 4 5 6 7