Typographyv2

Default font

The system font is used by default for all components. The default font sizes are:

12 on Windows
13 on macOS
15 on Linux

If FlatLaf scales the UI, then the default font size is scaled too.

Header styles

FlatLaf defines following header styles:

h00 and h0 are extra large headers for special use.

h1, h2 and h3 are the common headers. Often you need only one or two of them as "title" and/or "subtitle". Choose those that fit best to your application. These headers use semibold font weight. Variations with regular font weight are also available.

h4 has the same size as the default text, but is bold. Use it if you prefer bold (section) headers.

Text styles

FlatLaf defines following text styles:

large is useful where you need slightly larger text.
default is the default font used for all components.
medium and small are useful where you need slightly smaller text.
mini is useful for very small text. Use this only if really necessary.

monospaced can be used if you need a monospaced font.

Special font weights

Because Java/Swing supports out of the box only regular and bold font weights, FlatLaf defines following special font weights:

light is lighter than regular weight. Should be used only for larger font sizes.

semibold is bolder than regular weight, but lighter than bold weight. Can be used if bold weight looks too bold (e.g. in headers).

How to use

There are several ways to use the predefined fonts:

Assign a style class to the component (usually a label), which is recommended when using existing components.
Assign a style to the component, which is recommended when deriving fonts.
Assign the font directly, which is useful in renderers or in custom components.

Set style class

myTitleLabel.putClientProperty( "FlatLaf.styleClass", "h1" );

See table below for a list of available style classes.

Set style

myTitleLabel.putClientProperty( "FlatLaf.style", "font: $h1.font" );

This allows deriving fonts from predefined fonts. E.g. a bold h1 font or a large light font:

myTitleLabel.putClientProperty( "FlatLaf.style", "font: bold $h1.regular.font" );
myTitleLabel.putClientProperty( "FlatLaf.style", "font: 200% $light.font" );

See table below for UI keys of available fonts. Also see Font Syntax.

Set font

myTitleLabel.setFont( UIManager.getFont( "h1.font" ) );

See table below for a list of available UI keys.

Note that if your application supports theme switching without application restart, then the font is reset to the default component font. In this case either use FlatUIUtils.nonUIResource():

myTitleLabel.setFont( FlatUIUtils.nonUIResource( UIManager.getFont( "h1.font" ) ) );

Or override JComponent.updateUI(), which is invoked on theme change.

Available style classes and UI keys

Use the style class for the client property FlatLaf.styleClass.
Use the UI key for the client property FlatLaf.style or for UIManager.getFont().

Name	Style Class	UI Key	Size	Weight
H00	`h00`	`h00.font`	Default + 24	regular
H0	`h0`	`h0.font`	Default + 18	regular
H1 / H1	`h1` / `h1.regular`	`h1.font` / `h1.regular.font`	Default + 12	semibold / regular
H2 / H2	`h2` / `h2.regular`	`h2.font` / `h2.regular.font`	Default + 6	semibold / regular
H3 / H3	`h3` / `h3.regular`	`h3.font` / `h3.regular.font`	Default + 3	semibold / regular
H4	`h4`	`h4.font`	Default	bold
Large	`large`	`large.font`	Default + 2	regular
Default	n/a	`defaultFont`	Default	regular
Medium	`medium`	`medium.font`	Default - 1	regular
Small	`small`	`small.font`	Default - 2	regular
Mini	`mini`	`mini.font`	Default - 3	regular
Monospaced	`monospaced`	`monospaced.font`	Default	regular
Light	`light`	`light.font`	Default	light
Semibold	`semibold`	`semibold.font`	Default	semibold

Examples

Preview in FlatLaf theme editor:

"Tabs" tab in FlatLaf Demo:

About dialog of FlatLaf Demo:

Change font styles

The fonts are defined in FlatLaf.properties. The font sizes are relative to the size of the default font.

# headings
h00.font = +24
h0.font = +18
h1.font = +12 $semibold.font
h2.font = +6 $semibold.font
h3.font = +3 $semibold.font
h4.font = bold

h1.regular.font = +12
h2.regular.font = +6
h3.regular.font = +3

# text
large.font = +2
medium.font = -1
small.font = -2
mini.font = -3

The style classes (for client property FlatLaf.styleClass) are also defined in FlatLaf.properties. E.g.:

...
[style].h0 = font: $h0.font
...

To modify predefined fonts, use your own FlatLaf.properties file in the resources of your project and add (only) those fonts that you like to change. E.g.:

h3.font = bold +3

See Application properties files and Font Syntax for details.

Add font styles

If you need additional font styles, then add them to your FlatLaf.properties. E.g.

[style].xxxl = font: +36

And use it:

myTitleLabel.putClientProperty( "FlatLaf.styleClass", "xxxl" );

If you like to use also UIManager.getFont( "xxxl.font" ), then define it this way:

xxxl.font = +36
[style].xxxl = font: $xxxl.font

Change default font

To change the default font that is used for all components, add defaultFont to your FlatLaf.properties. E.g.

defaultFont = 13 "Open Sans", "Noto Sans", Roboto, Arial

To increase font size on Windows from 12 to 14 (as used in Windows 10/11 apps) use:

[win]defaultFont = +2

Notes

Font sizes of large, small and mini text styles are the same as used in Nimbus and Aqua (macOS) look and feels when client property JComponent.sizeVariant is set to "large", "small" or "mini".
Heading font sizes of h1, h2, h3 and h4 are (nearly) the same as heading font sizes used in Swing HTML. The only difference is h3, which is 14 in HTML and 15 here. But HTML headings are bold.