NovaUI v1.1.3 is now live

Ship React Native apps, faster.

A curated collection of beautifully designed, cross-platform UI components. Built with NativeWind. Open source and yours to customize. Inspired by shadcn/ui

Get Started Browse Components

Ready to use

Highly customizable

NovaUI Shell

50+

Components

5k+

Developers

10k+

Downloads

Everything you need to ship.

Detailed, accessible, and beautifully designed components that you can just copy and paste into your React Native applications.

Cancel

50+ Carefully Crafted Components

From simple buttons to complex navigation menus. Our comprehensive library gives you the building blocks to create stunning cross-platform applications.

className="...
flex items-center
justify-between
p-4 rounded-xl
bg-background"

NativeWind Powered

Use the Tailwind CSS utility classes you already know and love, directly in React Native.

Strictly TypeScript

Built with TypeScript from the ground up for superior DX, autocomplete, and reliability.

Copy, Paste, Ship

No npm install necessary. Just copy the code, paste it into your app, and customize it to your heart's content.

Truly Cross-Platform

Every component is tested to look and feel great on iOS, Android, and Web out of the box.

Interactive Showcase

Experience components live

Every component in our library is built for performance and pixel-perfection. Try them out directly in your browser.

Payment Method

All transactions are secure and encrypted.

Card

PayPal

Apple Pay

Name on Card

John Doe

Card Number

1234 5678 9012 3456

CVV

123

Month

Year

YYYY

No Team Members

Invite your team to collaborate on this project.

Notifications

Choose what you want to be notified about.

Push Notifications

Send to device

Email Notifications

Daily digest email

Marketing Emails

Product updates

Chat

Send a message to your team.

Hey! How's the project going?

Almost done! Deploying today.

Type a message...

Search components...

Button

Clickable actions

Card

Content container

Dialog

Modal overlay

Input

Text entry field

50+ results

FAQ

Yes. All components follow WAI-ARIA patterns.

Absolutely. You own the code and can modify anything.

Yes, light and dark themes work out of the box.

Status

ActivePendingErrorDraft

Rating

4.0 / 5

Loading...

Check your email

We sent a verification link to your email address.

Something went wrong

Your session has expired. Please log in again.

Preferences

I agree to the terms and conditionsSend me promotional emailsEnable two-factor authentication

How did you hear about us?

Price Range

Set your budget range ($200 – $800).

$200$560$800

Progress

Design85%

Development62%

Testing30%

Browse all 50+ components

Developer Experience

Beautifully designed,
yours to customize.

We provide the semantic structure and polished styles. You just drop them into your project and customize them with Tailwind CSS.

Cosmic Lullaby

NovaUI Audio

1:243:42

music-player.tsx

React Native

import { View, Text } from 'react-native'
import { Button, Card, Slider } from '@/components/ui'

export default function MusicPlayerCard() {
  return (
    <Card className="p-4 gap-6 rounded-3xl">
      <Image source={...} className="w-full aspect-square rounded-2xl" />

      <View className="flex-row justify-between pt-2">
        <View>
          <Text className="font-bold text-xl text-foreground">
            Cosmic Lullaby
          </Text>
          <Text className="font-medium text-muted-foreground">
            NovaUI Audio
          </Text>
        </View>
        <Button variant="ghost" size="icon">
          <Icon name="heart" />
        </Button>
      </View>

      <Slider value={32} max={100} />

      <View className="flex-row justify-between items-center">
        <Button variant="ghost" icon="repeat" />
        <View className="flex-row gap-6 items-center">
          <Button variant="ghost" icon="skip-back" />
          <Button size="icon" className="w-16 h-16 rounded-full bg-foreground">
            <Icon name="play" className="text-background fill-background" />
          </Button>
          <Button variant="ghost" icon="skip-forward" />
        </View>
        <Button variant="ghost" icon="list-music" />
      </View>
    </Card>
  );
}