AniUI

Introduction

Beautiful React Native components. Copy. Paste. Ship.

AniUI is a collection of 89 re-usable components for React Native, built with NativeWind or Uniwind (Tailwind CSS for React Native), rn-primitives for accessibility, and strict TypeScript. Inspired by shadcn/ui, these are not installed as npm dependencies — they are source files you copy into your project and own completely.

Architecture#

┌─ AniUI Design Layer (NativeWind or Uniwind styling)

├─ rn-primitives (headless behaviour + accessibility)

└─ React Native Core (View, Text, Pressable)

Why AniUI?#

  • You own the code. Components are source files, not black-box packages.
  • NativeWind + Uniwind. Tailwind CSS classes — choose your styling engine. No StyleSheet.create() anywhere.
  • rn-primitives for complex components. Dialog, Popover, Select, DropdownMenu get proper focus trapping, positioning, and ARIA semantics.
  • Mobile-first. Built for iOS and Android. Period.
  • Accessible. Every interactive component has proper accessibility roles, keyboard navigation, and screen reader support.
  • Dark mode. CSS variable-based theming works out of the box.
  • One command setup. npx @aniui/cli init auto-installs everything. npx @aniui/cli doctor diagnoses issues.

Tech Stack#

React Native0.76+
StylingNativeWind v4/v5 or Uniwind
Primitivesrn-primitives (Dialog, Popover, Select, Tabs, etc.)
TypeScriptStrict mode, no any
Variantsclass-variance-authority
ExpoSDK 53, 54 & 55
Bare RN0.76+ (no Expo required)
Package managersnpm, pnpm, yarn, bun

Component Tiers#

  • Tier 1 — Pure RN core + NativeWind (Button, Input, Text, Card, Badge, etc.)
  • Tier 2 — Needs react-native-reanimated (Skeleton, Toggle, Drawer, Carousel, etc.)
  • Tier 3 — Needs rn-primitives or external packages (Dialog, Popover, Select, Tabs, Bottom Sheet, etc.)
  • Tier 4 — Chart components (Area, Bar, Line, Pie, Radar, Radial)