tetra-ui

Overview

tetra-ui is an open-source component library built specifically for React Native, distributed through the shadcn CLI so the component source lives in the app. It is built by Liam and aims to provide the foundations for a clean, accessible and modern React Native design system.

The registry lists 44 UI components and a shared lib. Many components animate with React Native Reanimated, and several use Expo UI for native date pickers and selects. Gesture-driven pieces such as the bottom sheet, swipeable rows and slider rely on React Native Gesture Handler.

Features

• Core components: Button, card, badge, chip, avatar, alert, accordion, separator, skeleton and progress.
• Form inputs: Text input, textarea, password input, OTP input, search input, action input and a form helper built on react-hook-form.
• Selection: Checkbox, radio, switch, slider, segmented control, choicebox, select and native select.
• Native pickers: A native date select and native select built on Expo UI.
• Overlays: Bottom sheet, popover, menu, toast, scrim and portal.
• Gestures and layout: Swipeable rows, carousel, floating action button, stack and inline list.

Tech stack

• React Native, Expo
• React Native Reanimated, Gesture Handler, Safe Area Context, react-native-svg
• Expo UI, lucide-react-native, react-hook-form

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @tetra-ui/component-name