Tailwind CSS

NativeWind

GitHub branch checks state npm npm GitHub

> **Note** > > tailwindcss-react-native is current working on v2, which includes a renaming of the project to NativeWind! > > NativeWind is still under development `NativeWind` uses [Tailwind CSS](https://tailwindcss.com) as high-level scripting language to create a **universal design system**. Styled components can be shared between all React Native platforms, using the best style engine for that platform (e.g. CSS StyleSheet or StyleSheet.create). It's goals are to to provide a consistent styling experience across all platforms, improving Developer UX, component performance and code maintainability. `NativeWind` processes your styles during your application build, and uses a minimal runtime to selectively apply reactive styles (eg changes to device orientation, light dark mode). ## In Action ## Features - Works on **all** RN platforms, uses the best style system for each platform. - Uses the Tailwind CSS compiler - Styles are computed at **build time** - Small runtime keeps your components fast - Babel plugin for **simple setup** and improving **intellisense support** - Respects all tailwind.config.js settings, including **themes, custom values, plugins** - **dark mode / arbitrary classes / media queries** - pseudo classes - **hover / focus / active** on compatible components - styling based on **parent state** - automatically style children based upon parent pseudo classes - **children styles** - create simple layouts based upon parent class ## Documentation All documentation is on our website https://nativewind.dev