CSS font-size

The font-size property defines the text size.

It accepts any length value, such as, px, %, em, and others.

Keywords, such as, small, larger, and x-large are also accepted.



Three different font-size settings.

Text with font-size: 15px.

Text with font-size: x-large.

Text with font-size: 175%.

<p style="font-size: 15px">
  Text with font-size: 15px.
<p style="font-size: x-large">
  Text with font-size: x-large.
<p style="font-size: 175%">
  Text with font-size: 175%.


font-size: medium | xx-small | x-small | small | 
           large | x-large | xx-large | smaller | 
           larger | length | initial | inherit;



Values Description
medium Default. Mediumn font size.
xx-small Extra-extra-small font size.
x-small Extra small font size.
small Small font size.
large Large font size.
x-large Extra large font size.
xx-large Extra-extra-large font size.
smaller Smaller font size than the parent element.
larger Larger font size than the parent element.
length Font size in any CSS length value, such as, px, cm, em, and other units.
% Font size in percentage.
initial Sets the value to its default value.
inherit Inherits the value from its parent element.

More Examples

Click the buttons to see the different font-size values.

font-size: small

  .font-example {
    font-size: small;

<p class="font-example">
  font-size: small

Browser support

This table shows when font-size support started for each browser.

1.0 Dec 2008
1.0 Nov 2004
5.5 Jul 2000
7.0 Jan 2003
1.0 Jun 2003

You may also like

Last updated on Sep 30, 2023