Adding a custom font

Supported font sources

Avago works with the font sources small businesses actually use:

• Google Fonts — the simplest option. A large free library, served fast, no licensing to manage.
• Adobe Fonts — if your brand already uses a Typekit family, you can bring it in via your Adobe project.
• Self-hosted files — if you've licensed a font and have the web files (WOFF2 is ideal), you can upload them and host them with your site.

For most businesses, a Google Font that matches the brand is the easiest path and performs best.

Setting the font as a global type role

Don't apply a font block by block — set it once at the theme level. Avago uses global type roles: headings, body text, buttons and the like. Assign your font to the relevant role in your theme settings and it applies everywhere that role is used, across every page. Change your mind later and you change it in one place. Typically you'll set one font for headings and one for body, and let the roles do the work.

Performance implications

Fonts are easy to overdo, and they cost load time. Keep the site fast:

1. Limit families. One or two fonts is plenty. Each extra family is another download.
2. Limit weights. Only load the weights you actually use — regular, bold, maybe one more. Don't pull the whole range.
3. Prefer WOFF2 for self-hosted files; it's the smallest modern format.
4. Lean on the basics — Avago serves fonts efficiently and only loads what your pages need, but the fewer and lighter the files, the quicker the first paint.

A heavy custom font on the hero can delay the first thing visitors see. If speed matters more than a specific typeface, a well-chosen Google Font is the safer call.