Button

A flexible, fully-typed button component for React Native with variants, sizes, loading states, and icon support.

componentUI ComponentsExpo SDK 55Free

Preview

Interactive

9:41

Button Variants

Switch tabs to explore button variants, sizes, and states

Usage

No additional packages requiredZero deps

Built with React Native core only — no third-party UI library required.

Examples

Five style presets — default, secondary, outline, ghost, and destructive — to match every context.

tsx

import { View, StyleSheet } from 'react-native'';import { Button } from '~/components/ui/button'';export default function VariantsExample() {  return (    <View style={styles.stack}>      <Button variant="default"">Default</Button>      <Button variant="secondary"">Secondary</Button>      <Button variant="outline"">Outline</Button>      <Button variant="ghost"">Ghost</Button>      <Button variant="destructive"">Destructive</Button>    </View>  );}const styles = StyleSheet.create({  stack: { gap: 12, padding: 16 },});

Overview

Drop-in button for Expo apps built with NativeWind. Supports 5 style variants (default, secondary, outline, ghost, destructive), 3 sizes, loading spinner state, left/right icons, and icon-only mode. Zero dependencies beyond your existing RN setup.