---
title: "Design rules (design/*)"
description: "All 19 design rules void reports, each with severity, why it matters and how to fix it."
canonical: https://void-design.vercel.app/rules/design
lastModified: 2026-09-16
---

# Design rules

Measured design heuristics from computed styles: font families, type scale, line length, palette and accent sprawl, spacing grid, radius sprawl, dark mode and the tells of generated UI. Run `void design` or `void audit`.

| Rule | Severity | Problem |
| --- | --- | --- |
| [`design/too-many-font-families`](https://void-design.vercel.app/rules/design/too-many-font-families.md) | warn | Too many font families |
| [`design/no-type-scale`](https://void-design.vercel.app/rules/design/no-type-scale.md) | warn | Too many distinct font sizes (no type scale) |
| [`design/line-length-long`](https://void-design.vercel.app/rules/design/line-length-long.md) | warn | Body text lines are too long |
| [`design/line-length-short`](https://void-design.vercel.app/rules/design/line-length-short.md) | info | Body text lines are very short on desktop |
| [`design/body-text-small`](https://void-design.vercel.app/rules/design/body-text-small.md) | warn | Body text is smaller than 15px on mobile |
| [`design/body-line-height-tight`](https://void-design.vercel.app/rules/design/body-line-height-tight.md) | warn | Body line-height is too tight |
| [`design/heading-tracking`](https://void-design.vercel.app/rules/design/heading-tracking.md) | info | Large headings use default letter-spacing |
| [`design/heading-no-balance`](https://void-design.vercel.app/rules/design/heading-no-balance.md) | info | Headings do not use text-wrap: balance |
| [`design/palette-sprawl`](https://void-design.vercel.app/rules/design/palette-sprawl.md) | warn | Too many distinct colors |
| [`design/multiple-accents`](https://void-design.vercel.app/rules/design/multiple-accents.md) | warn | More than one accent hue |
| [`design/gradient-text`](https://void-design.vercel.app/rules/design/gradient-text.md) | info | Gradient-filled heading text |
| [`design/purple-gradient`](https://void-design.vercel.app/rules/design/purple-gradient.md) | info | Purple/indigo gradient background |
| [`design/emoji-icons`](https://void-design.vercel.app/rules/design/emoji-icons.md) | warn | Emoji used as icons |
| [`design/spacing-off-grid`](https://void-design.vercel.app/rules/design/spacing-off-grid.md) | info | Spacing values are off the 4px grid |
| [`design/radius-sprawl`](https://void-design.vercel.app/rules/design/radius-sprawl.md) | info | Too many different corner radii |
| [`design/no-dark-mode`](https://void-design.vercel.app/rules/design/no-dark-mode.md) | info | No dark mode support |
| [`design/color-scheme-missing`](https://void-design.vercel.app/rules/design/color-scheme-missing.md) | info | color-scheme is not declared |
| [`design/selection-unstyled`](https://void-design.vercel.app/rules/design/selection-unstyled.md) | info | ::selection is not styled |
| [`design/horizontal-overflow`](https://void-design.vercel.app/rules/design/horizontal-overflow.md) | warn | Page scrolls horizontally at 375px |