React Native UI
copy. paste. ship.
Production-ready components for React Native. No packages to install, no config needed. Just 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
Three 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={() => {}} />47 Components
All built with React Native core. Zero external packages.
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 sliderswitch
A control that allows the user to toggle between two states.
npx ra-ui add switchtable
A responsive table component.
npx ra-ui add tabletabs
A set of layered sections of content displayed one at a time.
npx ra-ui add tabstextarea
Displays a form textarea field.
npx ra-ui add textareatoast
A succinct message that is displayed temporarily.
npx ra-ui add toasttoggle
A two-state button that can be either on or off.
npx ra-ui add toggletoggle-group
A set of two-state buttons that can be toggled.
npx ra-ui add toggle-grouptooltip
A popup that displays information related to an element on hover.
npx ra-ui add tooltipbreadcrumb
Displays the path to the current page in a hierarchy.
npx ra-ui add breadcrumbcalendar
A date calendar component for selecting dates.
npx ra-ui add calendarcarousel
A swipeable carousel built with ScrollView.
npx ra-ui add carouseldate-picker
A date picker component with calendar popup.
npx ra-ui add date-pickerdropdown-menu
A menu of actions triggered by a button.
npx ra-ui add dropdown-menupagination
Navigation controls for paged content.
npx ra-ui add paginationpopover
Displays floating content triggered by a button.
npx ra-ui add popoverscroll-area
A scrollable area with customizable constraints.
npx ra-ui add scroll-areaautocomplete
A text input enhanced by a panel of suggested options.
npx ra-ui add autocompletenumber-input
A number input with increment and decrement buttons.
npx ra-ui add number-inputpassword-input
A password input with show/hide toggle.
npx ra-ui add password-inputsearch-bar
A search input with icon and clear button.
npx ra-ui add search-barrating
A star rating input for selecting a score.
npx ra-ui add ratingsnackbar
A brief notification at the bottom of the screen.
npx ra-ui add snackbarspeed-dial
A floating action button that expands to show multiple actions.
npx ra-ui add speed-dialbottom-nav
A bottom navigation bar with icons and labels.
npx ra-ui add bottom-navtimeline
A vertical timeline displaying events in order.
npx ra-ui add timelinestepper
A multi-step wizard progress indicator.
npx ra-ui add stepperchip-input
An input that creates removable chips/tags.
npx ra-ui add chip-inputCLI 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.