Made for NativeWind
Style with the className API you already know. Customize the design tokens or override any component to fit your app.
A personal React Native component library
Thoughtful UI.
Native by nature.
My personal collection of React Native components. Add only what you want, then make the source your own.
Not a replacement for React Native's built-in components. Just my own optional additions.
$ npm i midestic-rn-library
App.tsxTSX
1
import { Button }2
from "./src/components/ui/button";3
4
export default function WelcomeScreen() {5
return (6
<Button title="Get started"7
className="rounded-full bg-primary" />8
);9
}COMPONENT PREVIEW
A little less setup.A more considered starting point.Get started
NativeWind styles. Native feel.BUILT FOR THE WAY YOU BUILDReact Native·NativeWind·TypeScript
THE LIBRARY
The details, already considered.
Useful building blocks, careful defaults and room to make every screen your own.
Explore theming
A thoughtful component set
Buttons, inputs, overlays, layout primitives and more. Every component and prop is typed and ready to compose.
See it in Storybook
Explore interactive examples, compare variants and test component states in the Expo Storybook app.
UP AND RUNNING
From install to interface.
Copy only the components you choose into your app, where you can edit and maintain them yourself.
Follow the installation guideTerminalnpm
$ npm i midestic-rn-library
$ npx midestic-rn-library add button