heroui-native

Provides semantic React Native UI components styled with Uniwind Tailwind implementation.

Updated Feb 11, 2026

Search Tags:#theming #tailwind css #mobile development #ui components #react native #uniwind

Ready to run

npx skills add https://github.com/lexand-dev/subtrack-monorepo --skill heroui-native-lexand-dev

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: heroui-native
Source: https://github.com/lexand-dev/subtrack-monorepo/tree/main/.agents/skills/heroui-native
Command: npx skills add https://github.com/lexand-dev/subtrack-monorepo --skill heroui-native-lexand-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires heroui-native, react-native-reanimated, react-native-gesture-handler, react-native-safe-area-context, @gorhom/bottom-sheet, react-native-svg, react-native-worklets, tailwind-merge, tailwind-variants, uniwind, tailwindcss, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill simplifies the process of building user interfaces for React Native applications by providing a comprehensive, themeable component library that leverages the power of Tailwind CSS.

Core Features & Use Cases

Component Library: Access a wide range of pre-built, customizable UI components for React Native.
Tailwind Integration: Utilize Uniwind (Tailwind for React Native) for efficient and consistent styling.
Theming: Easily customize the look and feel of your application using semantic color variables and theme providers.
Use Case: Quickly scaffold a new mobile app screen by implementing a Card component with a primary action button and a TextField for user input, all styled consistently with your application's theme.

Quick Start

Install the 'heroui-native' package and its peer dependencies using npm.

Frequently Asked Questions about heroui-native

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

FAQPage Schema

How do I build React Native UIs with Tailwind CSS?▼

You can build React Native UIs with Tailwind CSS by using a component library styled with Uniwind, which provides pre-built semantic UI components and theme customization for mobile development.

What dependencies do I need to set up Tailwind CSS for React Native?▼

To set up Tailwind CSS for React Native, you need to install peer dependencies including react-native-reanimated, react-native-gesture-handler, react-native-safe-area-context, @gorhom/bottom-sheet, react-native-svg, and uniwind. These packages provide the required animations and gesture handling.

Can I use this React Native UI component library with Expo?▼

Yes, you can use this React Native UI component library with Expo. The setup provides essential installation instructions and configuration steps for both Expo and bare React Native projects to ensure proper theme integration.

How do I customize themes for React Native components?▼

You customize themes for React Native components by using semantic color variables and theme providers. This allows you to easily modify the look and feel of your application, ensuring UI consistency across all pre-built elements like buttons and text fields.

Does this component library support React Native gestures and animations?▼

Yes, the component library supports React Native gestures and animations by requiring react-native-reanimated, react-native-gesture-handler, and react-native-worklets as peer dependencies. These provide the underlying logic for interactive component behaviors.