React Native UI
copy. paste. ship.
The best shadcn alternative for React Native. Reusable components with zero dependencies. Better than tamagui and gluestack. One command and you own the code.
or use directly with npx
47+
Components
0
Dependencies
<500ms
Install Time
Free
Forever
Why developers love it
Built for speed, designed for ownership.
Zero Config
No init, no setup files. Run one command and start building immediately.
No Dependencies
Pure React Native core. Pressable, View, Text, StyleSheet. Nothing else.
You Own The Code
Components are copied into your project. Edit anything, no lock-in.
Blazing Fast CDN
Served via jsDelivr with 200+ edge servers. Install in under 500ms.
Get started in 30 seconds
Four steps. That's it.
Install globally (optional)
Install once, use anywhere. Or skip this and use npx directly.
npm install -g ra-ui
Add a component
Pick any component and add it to your project.
ra-ui add button # or without installing: npx ra-ui add button
Import and use
The component is now in your project. Import and go.
import { Button } from "./components/ui/button";
<Button title="Press me" variant="primary" onPress={() => {}} />Custom path (optional)
Change where components are saved. Add this to your package.json.
// package.json
{
"ra-ui": {
"path": "src/components"
}
}47+ Components
All built with React Native core. Zero external packages. More coming soon.
accordion
A vertically stacked set of collapsible sections.
npx ra-ui add accordionalert
Displays a callout for important messages.
npx ra-ui add alertalert-dialog
A modal dialog that interrupts with important content and expects a response.
npx ra-ui add alert-dialogavatar
An image element with a fallback for representing the user.
npx ra-ui add avatarbadge
Displays a badge or a component that looks like a badge.
npx ra-ui add badgebutton
Displays a button or a component that looks like a button.
npx ra-ui add buttoncard
Displays a card with header, content, and footer.
npx ra-ui add cardcheckbox
A control that allows the user to toggle between checked and not checked.
npx ra-ui add checkboxcollapsible
An interactive component that expands and collapses content.
npx ra-ui add collapsibledialog
A modal dialog that renders on top of the page.
npx ra-ui add dialoginput
Displays a form input field.
npx ra-ui add inputinput-otp
Accessible one-time password input with copy paste support.
npx ra-ui add input-otplabel
Renders an accessible label associated with controls.
npx ra-ui add labelprogress
Displays an indicator showing the progress of a task.
npx ra-ui add progressradio-group
A set of checkable buttons where only one can be checked at a time.
npx ra-ui add radio-groupselect
Displays a list of options for the user to pick from.
npx ra-ui add selectseparator
Visually separates content.
npx ra-ui add separatorsheet
A panel that slides in from the edge of the screen.
npx ra-ui add sheetskeleton
Used to show a placeholder while content is loading.
npx ra-ui add skeletonslider
An input where the user selects a value from within a given range.
npx ra-ui add sliderCLI Commands
npx ra-ui listnpx ra-ui add <name>npx ra-ui remove <name>npx ra-ui add <name> --forceStart building today
47+ production-ready components. Zero dependencies. One command away.