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.

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

# Install dependencies
npx expo install tailwindcss@^4 nativewind@5.0.0-preview.2 react-native-css@0.0.0-nightly.5ce6396 @tailwindcss/postcss tailwind-merge clsx

Add resolutions for lightningcss compatibility:

// package.json
{
  "resolutions": {
    "lightningcss": "1.30.1"
  }
}