[v4] Custom named --spacing-* values shadow leading-none staticValues (e.g. --spacing-none: 0 causes line-height: 0)
Author: nayukataCreated Feb 25, 2026Updated Sep 12, 2026
**What version of Tailwind CSS are you using?**
v4.1.18
**What build tool (or framework if it abstracts the build tool) are you using?**
Vite 7.x (Next.js 16.x)
**What version of Node.js are you using?**
v22.x
**What browser are you using?**
N/A (build output issue)
**What operating system are you using?**
macOS
**Reproduction URL**
https://play.tailwindcss.com/8zse4OUjaq
**Describe your issue**
When defining a custom named spacing value `--spacing-none: 0` in `@theme`, the `leading-none` utility outputs `line-height: 0` instead of the expected `line-height: 1`.
Reproduction CSS:
```css
@import "tailwindcss";
@theme {
--spacing-none: 0;
}
```
```html
This text has line-height: 0 instead of 1
``` **Expected:** `leading-none` outputs `line-height: 1` (as documented and as the `staticValues` fallback intends). **Actual:** `leading-none` outputs `line-height: 0`, sourced from `--spacing-none`. **Root cause in source:** The `leading` utility is defined with theme keys `["--leading", "--spacing"]`. When resolving `leading-none`: 1. `--leading-none` is not defined in the default theme 2. `--spacing-none: 0` is found via the `--spacing` fallback namespace 3. The `staticValues.none` (`line-height: 1`) is never reached because the theme lookup succeeded first This means any custom named `--spacing-*` value that shares a suffix with a `leading-*` static value will shadow it. The `--spacing` fallback is needed for numeric values like `leading-6` → `calc(var(--spacing) * 6)`, but named values create unintended collisions. **Workaround:** Explicitly define `--leading-none: 1` in `@theme` to take priority over the `--spacing` fallback. ```css @theme { --spacing-none: 0; --leading-none: 1; /* prevent --spacing-none from overriding */ } ``` **Note:** The [theme documentation](https://tailwindcss.com/docs/theme#spacing) describes `--spacing-*` as affecting "spacing and sizing utilities like `px-4`, `max-h-16`" — line-height is not mentioned as affected. This behavior contradicts that documentation.Source: tailwindlabs/tailwindcss