Style your React Native apps using Tailwind CSS.
The utility-first workflow you love from Tailwind CSS in your React Native applications. Enjoy consistent styling across platforms with the same intuitive classes.
export default function WelcomeConsentScreen() { return ( <SafeAreaView style={ROOT_STYLE}> <View className="mx-auto max-w-sm flex-1 justify-between gap-4 px-8 py-4 "> <View className="ios:pt-8 pt-12">12345678910111213141516171819202122232425262728293031323334353637383940<Text className="">Welcome to your </Text><Text className="">Application </Text> </View> <View className="gap-8"> {FEATURES.map((feature) => ( <View key={feature.title} className="flex-row gap-4"> <View className="pt-px"> <Icon name={feature.icon}className=""ios={{ renderingMode: 'hierarchical' }} /> </View> <View className="flex-1"><Text className="">{feature.title}</Text><Text variant="footnote">{feature.description}</Text> </View> </View> ))} </View> </View> </SafeAreaView> ); } const FEATURES = [ { title: 'Profile Management', description: 'Easily update and manage your personal information, settings, and preferences', icon: 'account-circle-outline', }, { title: 'Secure Messaging', description: 'Chat securely with friends and family in real-time.', icon: 'message-processing', }, { title: 'Activity Tracking', description: 'Monitor your daily activities and track your progress over time.', icon: 'chart-timeline-variant', }, ] as const;
Welcome to your
Application
Profile Management
Easily update and manage your personal information, settings, and preferences
Secure Messaging
Chat securely with friends and family in real-time.
Activity Tracking
Monitor your daily activities and track your progress over time.
Why Nativewind?
@theme { --font-sans: "Inter", sans-serif; --font-mono: "IBM Plex Mono", monospace; --text-tiny: 0.625rem; --text-tiny--line-height: 1.5rem; --color-mint-100: oklch(0.97 0.15 145); --color-mint-200: oklch(0.92 0.18 145); --color-mint-300: oklch(0.85 0.22 145); --color-mint-400: oklch(0.78 0.25 145); --color-mint-500: oklch(0.7 0.28 145); --color-mint-600: oklch(0.63 0.3 145); --color-mint-700: oklch(0.56 0.32 145); --color-mint-800: oklch(0.48 0.35 145); --color-mint-900: oklch(0.4 0.37 145); --color-mint-950: oklch(0.3 0.4 145); --color-mint-1000: oklch(0.2 0.42 145); --color-mint-1100: oklch(0.1 0.45 145); --color-mint-1200: oklch(0.05 0.48 145); --color-mint-1300: oklch(0.02 0.5 145); --color-mint-1400: oklch(0.01 0.52 145); --color-mint-1500: oklch(0.005 0.55 145); --color-mint-1600: oklch(0.002 0.58 145);
Who is using Nativewind?

Discover events and find people to join you—make solo events a thing of the past.
https://gogether.app/
Wave is the AI-powered transcription and summarization app for audio recordings and phone calls.
https://wave.co/
Turn Your Phone into a Productivity Companion—Not a Distraction!
https://www.focusminny.app/
Easily discover what you and your friends want to do, all in your hand, all in one place.
https://knowheresocial.com/
Swipey is the next-gen financial OS that helps you manage all your business finances in one place.
https://swipey.co/
Sustainable change through habits repeated daily. It's not about perfection, it's about consistency.
https://www.rovelist.app/
Take control of your daily routines. Track habits and never miss your supplements with smart reminders.
https://www.daystack.co/
Mylo är appen som gör juridiken enkel. Skapa juridiska avtal på egen hand, signera säkert med BankID och spara allt i ett tryggt moln.
https://mylo.law/
Wave is the AI-powered transcription and summarization app for audio recordings and phone calls.
https://wave.co/
Easily discover what you and your friends want to do, all in your hand, all in one place.
https://knowheresocial.com/
Turn Your Phone into a Productivity Companion—Not a Distraction!
https://www.focusminny.app/
Discover events and find people to join you—make solo events a thing of the past.
https://gogether.app/
Take control of your daily routines. Track habits and never miss your supplements with smart reminders.
https://www.daystack.co/
Mylo är appen som gör juridiken enkel. Skapa juridiska avtal på egen hand, signera säkert med BankID och spara allt i ett tryggt moln.
https://mylo.law/
Swipey is the next-gen financial OS that helps you manage all your business finances in one place.
https://swipey.co/
Sustainable change through habits repeated daily. It's not about perfection, it's about consistency.
https://www.rovelist.app/
Wave is the AI-powered transcription and summarization app for audio recordings and phone calls.
https://wave.co/
Discover events and find people to join you—make solo events a thing of the past.
https://gogether.app/
Easily discover what you and your friends want to do, all in your hand, all in one place.
https://knowheresocial.com/
Swipey is the next-gen financial OS that helps you manage all your business finances in one place.
https://swipey.co/
Turn Your Phone into a Productivity Companion—Not a Distraction!
https://www.focusminny.app/
Take control of your daily routines. Track habits and never miss your supplements with smart reminders.
https://www.daystack.co/
Mylo är appen som gör juridiken enkel. Skapa juridiska avtal på egen hand, signera säkert med BankID och spara allt i ett tryggt moln.
https://mylo.law/
Sustainable change through habits repeated daily. It's not about perfection, it's about consistency.
https://www.rovelist.app/UI Component Kits

NativewindUI
30+ beautiful components and flows that strive for a native look & feel. The perfect starting point for those who need to ship fast and look good doing it.

React Native Reusables
Build your own component libraries with react-native-reusables. Copy, paste, and tailor the code to suit your specific requirements.

Gluestack
Comprehensive React and React Native component library for building modern, high-performance web and mobile apps. Copy-paste UI components library & patterns crafted with Tailwind CSS (Nativewind).