---
title: "More than 3 font families loaded (lint/too-many-font-families)"
description: "lint/too-many-font-families: Each family is at least one more font request (often 20–50 KB each), and more than two or three typefaces reads as unfocused…"
canonical: https://void-design.vercel.app/rules/lint/too-many-font-families
lastModified: 2026-09-16
---

# More than 3 font families loaded

`lint/too-many-font-families` · severity **warn** · category Lint · detected by `void lint` and `void audit`

## Why it matters

Each family is at least one more font request (often 20–50 KB each), and more than two or three typefaces reads as unfocused design. Font bytes compete with the LCP image.

## How to fix it

Use at most 2 families plus a mono. Prefer variable fonts when you need several weights.

## Example

```ts
export const sans = Inter({ subsets: ['latin'], variable: '--font-sans' })
export const mono = JetBrains_Mono({ subsets: ['latin'], variable: '--font-mono' })
```

## References

- https://web.dev/articles/font-best-practices

## More lint rules

`void lint` reports 67 rules in this category. Static source checks with no browser: Tailwind v4 silent failures, Next.js 16 API traps, React render-body bugs, accessibility markup, SEO files and motion hygiene.

- `image-priority-deprecated` `priority` on `next/image` is deprecated in Next 16 — [lint/image-priority-deprecated](https://void-design.vercel.app/rules/lint/image-priority-deprecated)
- `missing-alt` Image without `alt` — [lint/missing-alt](https://void-design.vercel.app/rules/lint/missing-alt)
- `google-fonts-link` Google Fonts loaded via `<link>` / `@import` — [lint/google-fonts-link](https://void-design.vercel.app/rules/lint/google-fonts-link)
- `font-display` `@font-face` without `font-display` — [lint/font-display](https://void-design.vercel.app/rules/lint/font-display)
- `script-strategy` Third-party script loads too early — [lint/script-strategy](https://void-design.vercel.app/rules/lint/script-strategy)
- `browser-global-in-render` Browser global (`window`, `document`, `navigator`, `localStorage`) at module scope or during render — [lint/browser-global-in-render](https://void-design.vercel.app/rules/lint/browser-global-in-render)
- `timer-in-render` `setTimeout` / `setInterval` called in a component body — [lint/timer-in-render](https://void-design.vercel.app/rules/lint/timer-in-render)
- `motionvalue-subscribe-in-render` MotionValue `.on("change")` subscription in a component body — [lint/motionvalue-subscribe-in-render](https://void-design.vercel.app/rules/lint/motionvalue-subscribe-in-render)

Detected by `void lint` and `void audit`. Explain it in a terminal: `void rules lint/too-many-font-families`