gluestack-ui-v5:setup

Installs and configures gluestack-ui v5 with NativeWind v5 or UniWind on Tailwind CSS v4.

Updated Sep 6, 2026
One-click install
npx skills add https://github.com/sombek/fitness-guidance-app --skill gluestack-ui-v5-setup-sombek
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: gluestack-ui-v5:setup
Source: https://github.com/sombek/fitness-guidance-app/tree/main/mobile/.agents/skills/gluestack-ui-v5/setup
Command: npx skills add https://github.com/sombek/fitness-guidance-app --skill gluestack-ui-v5-setup-sombek

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Setting up gluestack-ui v5 requires coordinating Tailwind CSS v4's CSS-first configuration, a styling engine (NativeWind v5 or UniWind), Metro, PostCSS, and Babel, and mistakes like keeping a legacy tailwind.config.js or mispinning lightningcss cause build failures. ## Core Features & Use Cases - CLI-guided setup: Initialize projects with npx gluestack-ui@latest init, add individual or all components, and migrate from v4 using the @alpha tag. - Manual NativeWind v5 path: Provides exact package versions, the lightningcss 1.30.1 pin, global.css theme tokens, postcss.config.js, and metro.config.js for Expo and React Native CLI. - Manual UniWind path: A simpler Expo-only setup without PostCSS, including UniWind-specific global.css selectors, metro config, and Uniwind.setTheme() theme switching. - Use Case: A developer starting a new Expo app runs the CLI init, picks NativeWind v5, copies the provided global.css and config files, and gets a working themed component library without guessing version compatibility. ## Quick Start Ask the assistant to set up gluestack-ui v5 in your Expo project using the recommended CLI and NativeWind v5 styling engine.

Frequently Asked Questions about gluestack-ui-v5:setup

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I install gluestack-ui v5 in an Expo project?

Run `npx gluestack-ui@latest init` from your project root to add the GluestackUIProvider and essential components, then use `npx gluestack-ui@latest add button` or `add --all` for components. Requires react-native >= 0.76, expo >= 52, and node >= 18.

NativeWind v5 vs UniWind for gluestack-ui v5?

NativeWind v5 supports Expo and React Native CLI but requires PostCSS and a lightningcss 1.30.1 pin. UniWind is Expo-only but skips PostCSS and the lightningcss pin, making setup simpler, and uses Uniwind.setTheme() for theme switching.

Does gluestack-ui v5 support Next.js?

No, Next.js support is pending NativeWind v5 web support. The documentation recommends using gluestack-ui v4 for Next.js projects until v5 web support lands.

Why does NativeWind v5 fail to build with lightningcss errors?

NativeWind v5 requires lightningcss pinned to exactly version 1.30.1 in both the `overrides` and `resolutions` fields of package.json. After pinning, delete node_modules and reinstall dependencies to resolve the build errors.

Do I still need tailwind.config.js with gluestack-ui v5?

No, gluestack-ui v5 runs on Tailwind CSS v4 which is CSS-first. Delete tailwind.config.js, remove any tailwind.config alias from babel.config.js, and define all theme tokens in global.css using @layer theme and @theme inline blocks.

Why is my dark theme not applying on Expo Web with UniWind?

The .dark and .light selectors in global.css must be top-level inside @layer theme, never nested inside :root. Nested selectors will not match when UniWind transforms them for web, so the theme never applies.