Typography

Global fonts

• Body font: Paragraphs, lists, buttons and forms.
• Heading font: H1–H6, quotes, prices and stat numbers.

Choose from Google Fonts or the standard web fonts. Omni loads only the fonts and weights you pick.

Text

Heading one (H1) to Heading six (H6) set the size, weight and color per heading level. Modules use these as their defaults – the hero uses H1, section headings use H2, card titles use H4 or H5.

Body sets the base text size. Links sets the link font and color.

Fonts and page speed

Every font weight is its own file of about 60–110 KB, and visitors download each weight the page uses. Fonts matter most on phones with slow connections, so a few choices keep pages fast.

Omni's default fonts, Inter and Montserrat, ship with the theme as small files that cover Latin-script languages (SIL Open Font License). While the theme settings keep these two fonts, the home page loads about 65 KB of fonts instead of the full files. Characters outside those files, such as Greek, Cyrillic or Vietnamese text and many symbols, make the browser download the full font file for that weight as well. Omni's own link arrows are drawn without a font, so they never cause that.

• Use two font families at most, and only the weights the design needs. Omni's styles use three weights of the body font (regular, semibold and bold) and one weight for headings.
• A font or weight chosen in a module's Styles → Text settings loads on every page that uses that module, on top of the theme fonts.
• Standard web fonts such as Arial or Georgia need no download at all.
• Google Fonts are delivered by HubSpot from your own website domain, so visitors' browsers make no requests to Google.

Good to know

• Large headings scale down smoothly on small screens. You do not need separate mobile sizes.
• If a heading weight looks wrong, make sure that weight is selected in the font setting – browsers cannot show a weight that was never loaded.