Expo Uniwind Theme

Create a small CSS-first theme foundation for Expo. Preserve the installed Expo version, Expo Router structure, package manager, branding, and existing UI decisions.

Confirm the theme

Inspect the project first. Ask only for missing decisions: primary and secondary colors, neutral/background direction, light/dark support, font, and compact/comfortable/spacious density. Recommend accessible semantic status colors instead of asking for every value. When the project has no feedback system, include Sonner Native by default; preserve an existing toast system and skip Sonner only when the user asks.

Before changing files, tell the user in no more than five bullets what will change. Wait for approval unless implementation was already explicitly requested.

Inspect before setup

Read package.json, Expo config, Metro config, root layout, global CSS, and existing theme files. Also check for gesture-handler, safe-area, navigation, font, and feedback dependencies before installing anything. Use documentation matching the installed versions. Do not upgrade Expo, add Uniwind Pro, migrate from NativeWind, or remove an existing theme unless requested.

Install the current packages

Install uniwind and tailwindcss with the project's package manager so current compatible versions are resolved. Uniwind uses Tailwind CSS v4 and does not require a Babel preset or JavaScript Tailwind config for ordinary setup.

Import global.css from the Expo Router root layout or another component that mounts on every platform, never from index.ts or index.js. Keep withUniwindConfig as the outermost Metro wrapper and use a relative cssEntryFile. Because Tailwind scans from the CSS file's directory, add explicit @source entries for shared components or monorepo packages outside that scan root. Let Metro generate Uniwind typings; do not hand-maintain them.