---
title: "@font-face without woff2 (perf/font-format)"
description: "woff2 is about 30% smaller than woff and much smaller than ttf/otf, and every current browser supports it."
url: http://localhost:4173/rules/perf/font-format
updated: 2026-11-11
---

# @font-face without woff2

> `perf/font-format` is a vetd rule. It flags: @font-face without woff2. It runs on every `check`, together with the TypeScript check.

| Fact | Value |
| --- | --- |
| Rule id | `perf/font-format` |
| Severity | warning |
| Group | Performance: fonts, images, scripts and bundle |
| Tags | performance |

## Why it matters

woff2 is about 30% smaller than woff and much smaller than ttf/otf, and every current browser supports it.

## How to fix it

Convert the font to woff2 and list it first in src (or load it with next/font/local).

## Credit

Based on work by:

- [Google Chrome](https://developer.chrome.com/docs/lighthouse/overview): web.dev's font best practices recommend serving WOFF2 as the format with the best compression and universal support.

## References

- [Best practices for fonts](https://web.dev/articles/font-best-practices), web.dev
- [Optimize WebFont loading and rendering](https://web.dev/articles/optimize-webfont-loading), web.dev
- [@font-face CSS at-rule](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@font-face), MDN Web Docs

## Related rules

- [`perf/font-display`](http://localhost:4173/rules/perf/font-display.md)
- [`perf/font-weights`](http://localhost:4173/rules/perf/font-weights.md)

## Get this text from vetd

MCP: call `explain` with `{ "diagnosticId": "perf/font-format" }`. CLI: `npx vetd explain perf/font-format`.

---

[All 92 rules](http://localhost:4173/rules.md) · Previous: [`perf/font-display`](http://localhost:4173/rules/perf/font-display.md) · Next: [`perf/font-subsets`](http://localhost:4173/rules/perf/font-subsets.md)