Skip to main content

prefer-woff2

Require at least one woff2 source in each @font-face src list.

Rule catalog ID: R007

Targeted pattern scopeโ€‹

  • Font source lists in @font-face.

What this rule reportsโ€‹

  • @font-face blocks that have no woff2 source.

Why this rule existsโ€‹

woff2 provides the best modern compression and should be part of default source stacks.

โŒ Incorrectโ€‹

@font-face {
  src: url("./inter.woff") format("woff");
}

โœ… Correctโ€‹

@font-face {
  src: url("./inter.woff2") format("woff2"), url("./inter.woff") format("woff");
}

When not to use itโ€‹

Disable this rule if you are intentionally serving only legacy WOFF or TTF/EOT fonts to a constrained legacy-only environment where WOFF2 decoders are unavailable.

Ready-made WOFF2 resourcesโ€‹

If you do not yet have WOFF2 assets for your fonts, the following self-hosted repositories provide ready-to-use WOFF2 font files:

  • nerd-fonts-woff2 โ€” Automatically converted WOFF2 versions of the complete Nerd Fonts collection. Ideal for developer tooling, terminals, and icon-rich UIs.
  • popular-web-fonts-woff2 โ€” The top 100 most-used web fonts (Roboto, Open Sans, Lato, Montserrat, Poppins, Inter, and more) converted to WOFF2 and ready to self-host, eliminating the need for third-party font CDNs.

Further readingโ€‹