REACT-NATIVES

WIRED FOR SPEED

react-natives v2.1.2

Theme

Light

Dark

Get Started

←

Back to Home

🎨

Customizable Theme

Your brand. Your colors. Zero compromise.

1 file

Change to re-theme all 70+ components

Browse Components →

The Problem

The Trap of Rigid UI Libraries

Most component libraries ship with opinionated styles that fight your design system. You end up overriding styles in dozens of places, battling specificity wars, and shipping unnecessary CSS just to make a button match your brand color. Dark mode is often bolted on as an afterthought.

Our Solution

A Theming System Built to Flex

React-Natives uses CSS custom properties for every color token and NativeWind utility classes for layout and spacing. Change your brand color in one config file and it propagates across every component automatically — in both light and dark modes.

Key Benefits

🌙

Dark Mode Built-in

→

Every component adapts to the system color scheme automatically. Zero extra configuration.

🎯

Single Source of Truth

→

One config file. Change your brand color once — buttons, badges, switches, inputs all update.

🧱

NativeWind Overrides

→

Apply Tailwind utility classes directly on any component for one-off style overrides.

⚙️

Semantic Color Tokens

→

Tokens like background-0, typography-900, and primary-500 adapt across themes by design.

See It in Code

example.tsx

// theme-provider/config.ts — one file rules them all
export const config = {
  light: vars({
    '--color-primary-500': '99 102 241',  // ← change your brand color here
    '--color-primary-600': '79 70 229',
  }),
};

// Components pick it up automatically — no overrides needed
<Button action="primary" />   // uses primary500
<Badge action="info" />       // uses primary500
<Switch value={true} />       // uses primary500
<Progress value={60} />       // uses primary500

Ready to get started?

Explore all 70+ components and start shipping production-grade apps today.

Browse Components →

Back to Home

React-Natives

A comprehensive React Native component library.

Documentation

Getting Started

Components

Theming

Community

GitHub

Discord

Twitter

Blog

Support

FAQ

Contact

Contributing

License