About NativeWind
NativeWind brings Tailwind CSS to React Native. Developers style components with the same utility class names they use on the web. It is open source under the MIT license.
What it does
NativeWind turns class names into React Native styles, so layouts can be written with utilities for flex, padding, colors and text sizes. It supports platform prefixes such as ios: for iOS-specific styles, and it includes dark mode support. The goal is consistent styling across platforms with the same class names everywhere.
Key features
- Tailwind class names in React Native
- Platform prefixes such as ios: for targeted styles
- Dark and light mode support
- Examples and a showcase in the docs
- Pre-release of version 5 available
Who it's for
NativeWind suits React Native developers who already know Tailwind CSS and want the same workflow on mobile. It is also useful for teams that share styling conventions between a web app and a mobile app.
Pricing and good to know
NativeWind is open source under the MIT license. The site lists version 5 as a pre-release, so check which version you install and read its notes before you upgrade. The project has a docs site, a showcase and a blog.
Highlights
- Use Tailwind class names in React Native components
- Add platform-specific styles with prefixes like ios:
- Support dark and light mode with utility classes
- Read examples and a showcase in the docs
