Describe the bug
Custom line-height values defined via CSS variables in the Tailwind theme are not being applied to React Native Text components when using NativeWind classes (e.g., leading-md, leading-lg). The fontSize and letterSpacing from the same theme configuration work correctly, but lineHeight is ignored.
Reproduction
https://github.com/tylerbecks/nativewind-line-height-issue
The reproduction includes side-by-side comparisons of the same text with identical typography values:
- One using NativeWind classes (text-md leading-md tracking-md)
- One using inline styles (style={{ fontSize: 17, lineHeight: 22, letterSpacing: -0.43 }})
Custom line-height values are defined in the theme using CSS variables and mapped to Tailwind classes via @theme inline.
Expected behavior
When applying className="text-md leading-md tracking-md" to a React Native Text component, all three properties (fontSize, lineHeight, letterSpacing) should be applied correctly, matching the values defined in the CSS variables.
Actual behavior
- ✅ text-md (fontSize) works correctly
- ✅ tracking-md (letterSpacing) works correctly
- ❌ leading-md (lineHeight) does NOT work - line-height is not applied
When the same lineHeight value is applied via inline styles, it works correctly, proving this is specific to NativeWind class application.
Additional context
Environment:
- NativeWind version: preview
- React Native version: 0.81.5
- Expo version: ^54.0.0
- Tailwind CSS version: ^4.1.13
Describe the bug
Custom line-height values defined via CSS variables in the Tailwind theme are not being applied to React Native Text components when using NativeWind classes (e.g., leading-md, leading-lg). The fontSize and letterSpacing from the same theme configuration work correctly, but lineHeight is ignored.
Reproduction
https://github.com/tylerbecks/nativewind-line-height-issue
The reproduction includes side-by-side comparisons of the same text with identical typography values:
Custom line-height values are defined in the theme using CSS variables and mapped to Tailwind classes via @theme inline.
Expected behavior
When applying className="text-md leading-md tracking-md" to a React Native Text component, all three properties (fontSize, lineHeight, letterSpacing) should be applied correctly, matching the values defined in the CSS variables.
Actual behavior
When the same lineHeight value is applied via inline styles, it works correctly, proving this is specific to NativeWind class application.
Additional context
Environment: