# Expo App UI > Production-ready, copy-paste React Native components for Expo. TypeScript-first, accessible, New Architecture compatible — with minimal peer dependencies so your screens stay lightweight. Production-ready, copy-paste React Native components for Expo. TypeScript-first, accessible, New Architecture (Fabric) compatible, with minimal peer dependencies. Site: https://expo-ui.thunderdevelops.in Repository: https://github.com/Krish-Panchani/expo-app-ui npm: https://www.npmjs.com/package/expo-app-ui ## Documentation # Documentation - [Getting Started](/docs/getting-started): Learn how to install and use Expo App UI in your Expo React Native project. Quick start guide with installation, path aliases, and auto-dependency detection. - [CLI Commands](/docs/cli): Complete reference for all Expo App UI CLI commands including add, list, and overwrite options. Learn how to use the command-line interface to add components to your project. - [Compatibility](/docs/compatibility): Expo SDK, React Native, and New Architecture (Fabric/TurboModules) compatibility for expo-app-ui components. - [Comparison](/docs/comparison): How expo-app-ui compares to gluestack-UI, React Native Reusables, NativeBase, and React Native Paper. - Components - [Button](/docs/components/button): A flexible button component with variants and icon support for Expo React Native. Learn how to use Button with examples and API documentation. - [Custom Text](/docs/components/custom-text): A customizable Text component with font, color, and spacing props for Expo React Native. Learn how to use CustomText with examples and API documentation. - [Box View](/docs/components/box-view): A flexible layout component with comprehensive flexbox props for Expo React Native. Learn how to use BoxView with examples and API documentation. - [Badge](/docs/components/badge): A compact label for status, counts, and tags. Supports solid, outline, and subtle variants with semantic tones. - [Avatar](/docs/components/avatar): User avatar with image, initials fallback, and optional online/offline status indicator. - [Skeleton](/docs/components/skeleton): Animated placeholder for loading states. Shapes for lines, circles, and rectangles. - [Switch](/docs/components/switch): Animated toggle switch with three sizes and accessible switch role. - [Checkbox](/docs/components/checkbox): Accessible checkbox with optional indeterminate state and label support. - [Radio Group](/docs/components/radio-group): Single-select group of radio options with horizontal or vertical layout. - [Slider](/docs/components/slider): Touch-driven value slider with optional stepping and accessibility increment/decrement support. - [Tabs](/docs/components/tabs): Three tab styles (underline, pills, segmented) with animated indicator and scrollable variant. - [Tooltip](/docs/components/tooltip): Long-press tooltip that auto-positions and clamps within the viewport. - [Dialog](/docs/components/dialog): Confirmation and alert dialog with title, description, and configurable actions. - [Toast](/docs/components/toast): Lightweight notification that appears from the top or bottom and auto-dismisses. - [Snackbar](/docs/components/snackbar): Bottom-anchored notification with an optional action button. Material Design style. - [Bottom Sheet](/docs/components/bottom-sheet): Modal bottom sheet with swipe-to-dismiss, dynamic content height, and animated backdrop. - [Custom Modal](/docs/components/custom-modal): An animated modal component with backdrop, bottom sheet support, and smooth animations for Expo React Native. Learn how to use CustomModal with examples and API documentation. - [Accordion](/docs/components/accordion): An expandable accordion component with smooth animations and customizable theming for Expo React Native. Learn how to use Accordion with examples and API documentation. - [Calendar](/docs/components/calendar): A flexible calendar component supporting single date selection, date ranges, and customizable theming for Expo React Native. Learn how to use Calendar with examples and API documentation. - [Calender (deprecated)](/docs/components/calender): Deprecated alias for the Calendar component. Use `calendar` instead. - [Birthdate Picker](/docs/components/birthdate-picker): A native-style date picker component for selecting birthdates with month, day, and year wheels for Expo React Native. Learn how to use CustomBirthdatePicker with examples and API documentation. - [OTP Input](/docs/components/otp-input): A customizable OTP (One-Time Password) input component with validation states, loading, success, and error states for Expo React Native. Learn how to use OTPInput with examples and API documentation. - [Profile Pic](/docs/components/profile-pic): A profile picture component with fallback, loading state, and customizable styling for Expo React Native. Learn how to use ProfilePic with examples and API documentation. - [Progress Bar](/docs/components/progress-bar): A customizable progress bar component with variants, labels, and count support for Expo React Native. Learn how to use ProgressBar with examples and API documentation. - [Loading Bar & Top Loading Bar Context](/docs/components/loading-bar): A top loading bar component with React Context for managing loading state across your Expo React Native application. Complete setup guide with examples. - [Marquee](/docs/components/marquee): A smooth scrolling marquee component (also known as scroll text animation) for displaying continuous text or content in Expo React Native. Learn how to use Marquee with examples and API documentation. - [Auto Scroll Cards](/docs/components/auto-scroll-cards): A carousel component with auto-scrolling, manual swipe, and indicator support for Expo React Native. Learn how to use AutoScrollCards with examples and API documentation. - Constants - [Theme Constants](/docs/constants/theme): Theme constants including colors, fonts, and sizes for consistent styling in Expo React Native. Learn how to use the theme constants in your project. - Helpers - [normalizeSize](/docs/helpers/normalizeSize): A utility function to normalize font sizes based on device font scale for Expo React Native. Learn how to use normalizeSize to handle accessibility settings.