Bug: Cannot set className and style at the same time in v5

Describe the bug
In web versions of tailwind, and Nativewind v4, setting both className and style on an element would combine the two styles, with duplicate definitions having the style tag's value overwrite the class.

In Nativewind v5, this no longer works. Setting only className or only style works, but when you set both, the className property is completely ignored, with only the values from style applying.

Reproduction
Please see our contribution guide: https://github.com/nativewind/nativewind/blob/main/contributing.md#opening-an-issue

Below is a github repo that contains two rn-new boilerplate projects, one using nativewind 4 and one nativewind 5. A demo code snippet in App.tsx demonstrates styling with only className, styling with only the style prop, and a combination of the two.
https://github.com/beebls/nativewind-issue-demo

Expected behavior
Using the below code snippet on nativewind 4 and 5 yields different results.

import { View } from 'react-native';
import './global.css';

export default function App() {
  return (
    <View className="h-full w-full items-center justify-center bg-red-800">
      <View className="bg-blue-400 p-4" style={{ borderWidth: 10 }}>
        <View style={{ backgroundColor: 'white', width: 100, height: 100 }}></View>
      </View>
    </View>
  );
}

Notice how the border from the style property is applied on both, but the background color and padding are only working on nativewind 4.

Additional context
I've observed this both in expo go and in dev client apps.

Additionally, this happens even if you set style={{}} or style={undefined}

Also getting this, using Expo Dev Client.

@marklawlor

@marklawlor It seems that fixing this issue #192 broke it

I'm experiencing the same issue in my codebase with NativeWind v5 when combining style and className props.

Environment specifics:

The combination of style + className works properly on web builds
It fails on native builds (tested iOS) when both props are present

Looking forward to a fix for this! 🙏
Even if Nativewind v5 is still a preview, its the only way for us to use the Expo SDK 54 and Reanimated v4 without UI issues.

@marklawlor

Thanks for the detailed issue, assigning this to @marklawlor.

I think style and className together should only be used in rare cases anyway

I strongly disagree with this. It's pretty hard to avoid within react native when using dynamic values or while working with reanimated.

Well.. I guess all apps are made different. However, that is certainly not a rare occurrence in my experience 🙃

@DaltonPelkey

@DaltonPelkey agree this is not uncommon

I understand that the team may not have the capacity to ship a large number of features, but this unfortunately gives the impression that the project might be losing maintenance and support 😕
Personally, I’ve decided to migrate https://turbostarter.dev to https://uniwind.dev/

I understand that the team may not have the capacity to ship a large number of features, but this unfortunately gives the impression that the project might be losing maintenance and support 😕 Personally, I’ve decided to migrate https://turbostarter.dev to https://uniwind.dev/

I used Claude Code to complete the migration in half an hour. It's awesome.

I understand that the team may not have the capacity to ship a large number of features, but this unfortunately gives the impression that the project might be losing maintenance and support 😕 Personally, I’ve decided to migrate https://turbostarter.dev to https://uniwind.dev/

I'd migrate too but only complication is having to use another classname for colors, but its still an interesting project

I am a big fan or Mark and Dan, and have been a huge proponent of NativeWind (I use v5 in production with the patch). But, a friend suggested I look at react-native-tailwind and I got to say, it is really nice. "Compile-time Tailwind CSS for React Native with zero runtime overhead". If you are struggling with the complexity of NativeWind and are considering unwind, take a look at react-native-tailwind before committing.

No way this is not fixed yet. How such a big package ignored a whole community issue and kept shipping new features without fixing an actually problem that might make their users migrate to a new package because of it.

Hey y'all, I'm closing this issue out as it's sort of off the rails.

I've shared updates on where we're at and you can track progress on Github Discussions for v4, Github Discussions for v5, and Twitter.

I'll post an update in the discussions and twitter regarding v5 stuff as soon as I've made some meaningful changes. Swapping into v5 now that I've done some clean up on v4, as v4 is our stable version.

@tyrauber

FYI, as indicated in the announcement, I finally have publishing access for npm so I'll go ahead and publish @tyrauber's changes in a new version of v5, likely early next week.

I just released v3.0.2 of react-native-css which should include the fix for this issue. If someone is still facing it, please open a new issue and I'll look into it.

Navigation Menu

Repository navigation

Bug: Cannot set className and style at the same time in v5 #233

32 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Bug: Cannot set className and style at the same time in v5 #233

Description

Activity

aussieljk commented on Oct 16, 2025

puerschel93 commented on Oct 16, 2025

Bartek532 commented on Oct 18, 2025

alexeev7a commented on Oct 20, 2025

JeanDes-Code commented on Oct 20, 2025

rgcjhn commented on Oct 22, 2025

danstepanov commented on Oct 22, 2025

DaltonPelkey commented on Oct 24, 2025

DaltonPelkey commented on Oct 24, 2025

danstepanov commented on Oct 24, 2025

stonega commented on Oct 25, 2025

32 remaining items

Bartek532 commented on Dec 22, 2025

dvlin-dev commented on Dec 22, 2025

monyasau commented on Dec 31, 2025

tyrauber commented on Jan 6, 2026

18jad commented on Feb 20, 2026

danstepanov commented on Feb 20, 2026

danstepanov commented on Feb 20, 2026

danstepanov commented on Feb 21, 2026

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions