12
Expo · NativeWind v4 · rn-primitives


Ship everywhere.

A component library where every piece feels native because it is. iOS, Android, and Web from one codebase — styled with Tailwind, accessible by default.

Expo Router NativeWind v4 rn-primitives TypeScript CVA Variants Dark Mode Accessible iOS · Android · Web
Scroll
Button
Card
Switch
Checkbox
Dialog
Progress
Badge
Avatar
Select
Slider
Separator
Text
Button
Card
Switch
Checkbox
Dialog
Progress
Badge
Avatar
Select
Slider
Separator
Text
Why Crossbits?
One codebase. Three platforms. Zero compromise.

Stop copying components between projects. Crossbits gives you a single production-ready component system that compiles Tailwind to native StyleSheet on iOS and Android, and real CSS on Web.

BUTTONS (WEB)
Get Started
Learn More
SWITCHES
Notifications
Dark Mode
Pro Plan
12 components
BUTTONS
Get Started
Learn More
Delete Account
SWITCHES
Notifications
Dark Mode
Analytics
Pro Plan
All 12 components
Active
v1.0
BUTTONS
Get Started
Learn More
SWITCHES
Notifications
Dark Mode
Pro Plan
All 12 components
Active
How it works
Write once.
Runs native.

Tailwind className on React Native. NativeWind v4 compiles to StyleSheet on native, CSS on web.

CVA variants — same pattern as shadcn/ui
rn-primitives for headless accessible base
forwardRef + full TypeScript throughout
CSS variable tokens for automatic dark mode
Button.tsx
Copy
import { Pressable } from 'react-native';
import { cva } from 'class-variance-authority';
import { cn } from '~/lib/utils';

const buttonVariants = cva(
  'flex-row items-center justify-center rounded-full',
  { variants: {
      variant: {
        default:     'bg-primary',
        destructive: 'bg-destructive',
        outline:     'border border-input',
      },
      size: {
        sm: 'h-9 px-4 text-sm',
        md: 'h-11 px-5 text-base',
        lg: 'h-14 px-6 rounded-2xl',
      },
    }
  }
);

// Works on iOS, Android & Web
<Button variant="default" size="lg" label="Get Started" />
0
Components
0
Platforms
0
Extra deps beyond RN
v4
NativeWind
All Components
Everything you need
Production-ready. Accessible by default. iOS, Android, and Web from a single component file.
Core
Button
Pressable with CVA variants, sizes, and native haptic feedback.
Get Started
Learn More
Delete Account
Input
Switch
iOS-style toggle via rn-primitives.
Notifications
Dark Mode
Analytics
Feedback
Progress
Animated bar driven by value prop.
Downloading78%
Installing55%
Complete100%
Input
Checkbox
Accessible checkbox with animated checkmark.
Accept terms of service
Subscribe to newsletter
Save preferences
Layout
Card
Container with Header, Content & Footer subcomponents.
Pro Plan
All 12 components
Active
v1.0
Display
Badge
Status labels with CVA variants.
Default
Secondary
Destructive
Display
Avatar
Image with fallback initials and status.
AK
SR
JL
MK
+8
Layout
Separator
Horizontal and vertical divider.
Overlay
Dialog
Accessible modal with focus trap.
Input
Select
Native dropdown via rn-primitives.
Input
Slider
Touch-friendly range input.
Aa
Core
Text
Typography with iOS-style scale.