Tailwind CSS Setup for Expo with react-native-css

This guide covers setting up Tailwind CSS v4 in Expo using react-native-css and NativeWind v5 for universal styling across iOS, Android, and Web.

When to Use

• You need to set up Tailwind CSS v4 styling in an Expo app using react-native-css and NativeWind v5.
• The task involves configuring Metro, PostCSS, global CSS, or package versions for Expo + Tailwind.
• You want one styling setup that works across iOS, Android, and web in an Expo project.

Overview

This setup uses:

• Tailwind CSS v4 - Modern CSS-first configuration
• react-native-css - CSS runtime for React Native
• NativeWind v5 - Metro transformer for Tailwind in React Native
• @tailwindcss/postcss - PostCSS plugin for Tailwind v4

Installation