Skip to main content

consistent-font-display

Require one font-display strategy per stylesheet.

Rule catalog ID: R012

Targeted pattern scopeโ€‹

  • All font-display declarations inside @font-face blocks.

What this rule reportsโ€‹

  • Files that mix display values such as swap and fallback.

Why this rule existsโ€‹

Mixed strategies make perceived loading behavior inconsistent across fonts in the same page.

โŒ Incorrectโ€‹

@font-face {
  font-family: "Inter";
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-display: fallback;
}

โœ… Correctโ€‹

@font-face {
  font-family: "Inter";
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  font-display: swap;
}

Further readingโ€‹