All blocks with Typography settings have the same selection of font sizes available. Font sizes are fluid and automatically adapt to the screen width they are viewed on. We use CSS clamp in the theme.json theme files to archive fluid fonts.
You can choose the following sizes:
value desktop mobile 3xs 12 12 2xs 14 14 xs 16 16 s 18 18 m 20 18 l 24 20 xl 30 24 2xl 36 30 3xl 48 36 4xl 60 36 5xl 72 36 6xl 96 48 7xl 128 60 8xl 192 72 9xl 296 96
How to set a font size
After adding your block in the editor open the Settings panel and scroll to the Typography settings. Choose one of the font sizes from the drop down menu.
Using custom font sizes
Additionally, to the font sizes that come with our system, it is also possible to use a custom font sizes. Please note that custom font sizes are not responsive, but instead use a fixed pixel or rem value. To keep the consistency of the design, a custom set font size should only be used if no other font sizes works.
Reset font sizes
To reset the font size to the default value, click on View Options (the icon with the three small vertical dots) in the Typography settings. This opens additional Typography settings, including the Reset option.