Tamagui Complete Documentation llms.txt 路 AI Docs Browser 路 mdream [llms.txt Tools](https://mdream.dev/llms-txt/tamagui/llms-txt) # Tamagui Complete Documentation llms.txt Browse Tamagui Complete Documentation documentation as markdown. Click any page in the sidebar to view it, or copy the full llms.txt for your AI tools. tamagui.dev/llms.txt [Raw llms.txt](https://tamagui.dev/llms.txt) [Raw llms-full.txt](https://tamagui.dev/llms-full.txt) Copy Markdown [](https://tamagui.dev/llms.txt) llms.txt components/accordion/1.0.0 title: Accordion description: A vertically stacked set of interactive headings with content. name: accordion component: Accordion package: accordion Installation Anatomy API Reference Examples Accessibility components/accordion/2.0.0 title: Accordion description: A vertically stacked set of interactive headings with content name: accordion component: Accordion package: accordion demoName: Accordion Installation Anatomy API Reference Examples Accessibility components/alert-dialog/1.0.0 title: AlertDialog description: Show an alert prompt in a dialog name: alertDialog component: AlertDialog package: alert-dialog demoName: AlertDialog Installation Anatomy API Reference Examples components/alert-dialog/2.0.0 title: Alert Dialog description: Show an alert prompt in a dialog name: alert-dialog component: AlertDialog package: alert-dialog demoName: AlertDialog Installation Anatomy API Reference components/anchor/1.0.0 title: Anchor description: Link to external websites. name: html component: Anchor Usage API Reference components/anchor/2.0.0 title: Anchor description: Link to external websites name: anchor component: Anchor package: html Installation Usage API Reference components/avatar/1.0.0 title: Avatar description: Display aspect-fixed images with a fallback while loading name: avatar component: Avatar package: avatar demoName: Avatar Installation Usage API Reference components/avatar/2.0.0 title: Avatar description: Display aspect-ratio-fixed images with a fallback while loading name: avatar component: Avatar package: avatar demoName: Avatar Installation Usage API Reference components/button/1.0.0-alpha title: Button description: A simple button component name: button component: Button demoName: Button components/button/1.0.0-beta.0 title: Button description: A simple button component name: button component: Button demoName: Button components/button/1.0.0 title: Button description: A simple button component name: button component: Button package: button demoName: Button components/button/1.28.0 title: Button description: An incredibly flexible button. name: button component: Button package: button demoName: Button Usage API Reference components/button/2.0.0 title: Button description: A simple button component name: button component: Button package: button demoName: Button Installation Usage Sizing Variants Icon Theming Group Theming Web Form Props Text Styling Creating Your Own Button API Reference components/card/1.0.0 title: Card description: Sizable, themeable cards with a flexible API. name: card component: Card package: card demoName: Card Installation Anatomy API Reference components/card/2.0.0 title: Card description: Sizable, themeable cards with a flexible API name: card component: Card package: card demoName: Card Installation Anatomy API Reference components/checkbox/1.3.0 title: Checkbox description: A simple checkbox component name: checkbox component: Checkbox package: checkbox demoName: Checkbox Installation Usage API Reference components/checkbox/1.85.0 title: Checkbox description: A simple checkbox component name: checkbox component: Checkbox package: checkbox demoName: Checkbox Installation Usage API Reference components/checkbox/1.89.0 title: Checkbox description: Toggle state in forms. name: checkbox component: Checkbox package: checkbox demoName: Checkbox Installation Usage API Reference components/checkbox/2.0.0 title: Checkbox description: Toggle state in forms name: checkbox component: Checkbox package: checkbox demoName: Checkbox Installation Usage API Reference components/context-menu/2.0.0 title: Context Menu description: A menu component triggered by right-click on web and long press on touch devices name: context-menu component: ContextMenu package: context-menu demoName: ContextMenu Installation Anatomy API Reference components/dialog/1.0.0 title: Dialog description: Show a modal with configurable layout and accessible actions. name: dialog component: Dialog package: dialog demoName: Dialog Installation Anatomy API Reference Examples components/dialog/1.131.0 title: Dialog description: Show a modal with configurable layout and accessible actions. name: dialog component: Dialog package: dialog demoName: Dialog Installation Anatomy Scoping Dismissal Behavior API Reference Examples components/dialog/2.0.0 title: Dialog description: Show a modal with configurable layout and accessible actions name: dialog component: Dialog package: dialog demoName: Dialog Installation Anatomy Scoping Dismissal Behavior API Reference components/focus-scope/1.128.0 title: FocusScope description: Manage focus behavior within elements accessibly. name: focus-scope component: FocusScope package: focus-scope Installation Usage Focus Trapping Focus Looping Animation-Friendly Focusing Advanced Control with FocusScopeController Function as Children API Reference Usage in Other Components Accessibility Examples components/focus-scope/2.0.0 title: FocusScope description: Manage focus behavior within elements accessibly. name: focus-scope component: FocusScope package: focus-scope Installation Usage Focus Trapping Focus Looping Animation-Friendly Focusing Advanced Control with FocusScopeController Function as Children API Reference Usage in Other Components Accessibility Examples components/form/1.3.0 title: Form description: A simple form component for native and web. name: form component: Form package: form demoName: Form Installation Anatomy API Reference components/form/2.0.0 title: Form description: A simple form component for native and web name: form component: Form package: form demoName: Form Installation Anatomy API Reference components/group/1.0.0 title: Group description: Render horizontal or vertical groups easily. name: group component: Group demoName: Group Usage Sizing Disabled Group API components/group/1.11.2 title: Group description: Render horizontal or vertical groups easily. name: group component: Group demoName: Group Usage Sizing Disabled API Reference components/group/1.56.1 title: Group description: Render horizontal or vertical groups easily. name: group component: Group demoName: Group Installation Usage Sizing Disabled API Reference components/group/1.6.0 title: Group description: Render horizontal or vertical groups easily. name: group component: Group demoName: Group Usage Sizing Disabled Group API components/group/1.7.0 title: Group description: Render horizontal or vertical groups easily. name: group component: Group demoName: Group Usage Sizing Disabled Group API components/group/2.0.0 title: Group description: Render horizontal or vertical groups easily name: group component: Group package: group demoName: Group Installation Usage Sizing Separators Disabled Custom Components & Nested Items API Reference components/headings/1.0.0 title: Headings description: Heading components that mimic HTML equivalents name: html component: Headings package: text demoName: Headings Installation How it works API Reference components/headings/2.0.0 title: Headings description: Heading components that mirror HTML equivalents name: headings component: Headings package: text demoName: Headings Installation How it works API Reference components/html-elements/1.0.0 title: HTML Elements description: Render semantic HTML with these elements. name: html-elements component: Layouts Installation HTML element props components/html-elements/2.0.0 title: HTML Elements description: Render semantic HTML with these elements name: html-elements component: Layouts package: elements Installation API Reference components/image/1.0.0 title: Image description: React Native Web Image + Tamagui style props. name: html component: Image package: image demoName: Image components/image/1.13.0 title: Image description: React Native Web Image + Tamagui style props. name: html component: Image package: image demoName: Image Installation Usage API Reference components/image/2.0.0 title: Image description: A pure, lightweight Image component with Tamagui style props name: image component: Image package: image demoName: Image Installation Usage Using with expo-image Accessibility API Reference components/inputs/1.0.0 title: Input & Textarea name: inputs description: Flexible form fields in styled and unstyled forms. component: Input demoName: Inputs Installation Input TextArea components/inputs/2.0.0 title: Input & TextArea name: inputs description: Flexible form fields in styled and unstyled forms component: Input package: input demoName: Inputs Installation Input TextArea components/intro/1.0.0 title: Tamagui UI Setup components/intro/2.0.0 title: Tamagui UI description: React Native UI kit with copy-paste composable components Setup components/label/1.0.0 title: Label description: Label form elements with accessibility. name: label component: Label package: label demoName: Label Installation Usage Accessibility API Reference components/label/2.0.0 title: Label description: Label form elements with accessibility name: label component: Label package: label demoName: Label Installation Usage Accessibility API Reference components/linear-gradient/1.0.0-alpha title: Linear Gradient description: Linear Gradient that works with Tamagui style props. name: html component: LinearGradient demoName: LinearGradient components/linear-gradient/1.0.0 title: Linear Gradient description: Linear gradients that work with Tamagui style props name: html component: LinearGradient demoName: LinearGradient Installation Usage API Reference components/linear-gradient/2.0.0 title: Linear Gradient description: Linear gradients that work with Tamagui style props name: linear-gradient component: LinearGradient package: linear-gradient demoName: LinearGradient Installation Usage API Reference components/list-item/1.0.0 title: ListItem description: A component for showing columns of items. name: list-item component: ListItem package: list-item demoName: ListItem Installation Usage Sizing Icon Theming Customization API Reference components/list-item/2.0.0 title: ListItem description: A component for displaying rows of items name: list-item component: ListItem package: list-item demoName: ListItem Installation Usage Sizing Title and SubTitle Icon Theming Variant Apply (Context) Customization API Reference components/lucide-icons/1.0.0 title: Lucide Icons description: Cross-platform compatible SVG based icons demoName: LucideIcons Installation Usage Credit components/lucide-icons/2.0.0 title: Lucide Icons description: Cross-platform compatible SVG-based icons name: lucide-icons component: LucideIcons package: lucide-icons demoName: LucideIcons Installation Usage Credit components/menu/2.0.0 title: Menu description: A selectable list in a popover with nested submenus name: dropdown menu component: Menu package: menu Installation Anatomy API Reference Styling components/native/2.0.0 title: Native UI description: Optional native integrations for better performance and UX name: native @tamagui/native Package Portal Gesture Handler Menu & ContextMenu Toast LinearGradient components/new-inputs/1.0.0 title: Input & Textarea name: inputs component: Input demoName: Inputs Installation Input TextArea components/new-inputs/2.0.0 title: Input & TextArea description: Single-line and multi-line text inputs with web-first API name: inputs component: Input package: input demoName: Inputs Installation Usage Web-First API Styling Native-Only Props Cross-Platform Text Behavior Migration from v1 API Reference components/popover/1.0.0 title: Popover description: A simple popover component name: popover component: Popover package: popover demoName: Popover Installation Anatomy API Reference components/popover/1.110.0 title: Popover description: Show content in a floating pane. name: popover component: Popover package: popover demoName: Popover Installation Anatomy API Reference components/popover/1.125.0 title: Popover description: Show content with a trigger in a floating pane. name: popover component: Popover package: popover demoName: Popover Installation Anatomy API Reference components/popover/1.128.0 title: Popover description: Show content with a trigger in a floating pane. name: popover component: Popover package: popover demoName: Popover Installation Anatomy API Reference components/popover/1.129.0 title: Popover description: Show content with a trigger in a floating pane. name: popover component: Popover package: popover demoName: Popover Installation Anatomy API Reference components/popover/1.131.0 title: Popover description: Show content with a trigger in a floating pane. name: popover component: Popover package: popover demoName: Popover Installation Anatomy Scoping API Reference components/popover/1.43.0 title: Popover description: A simple popover component name: popover component: Popover package: popover demoName: Popover Installation Anatomy API Reference components/popover/1.83.0 title: Popover description: A simple popover component name: popover component: Popover package: popover demoName: Popover Installation Anatomy API Reference components/popover/2.0.0 title: Popover description: Show content with a trigger in a floating pane name: popover component: Popover package: popover demoName: Popover Installation Anatomy Scoping API Reference Utility Functions components/portal/1.0.0 title: Portal description: Send items to other areas of the tree. name: portal component: Portal package: portal components/portal/2.0.0 title: Portal description: Send items to other areas of the tree name: portal component: Portal package: portal Native Portal Setup (Recommended) Alternative Approaches API Reference Technical Details components/progress/1.0.0 title: Progress description: Display a bar to indicate percent completion. name: progress component: Progress package: progress demoName: Progress Installation Usage API Reference components/progress/1.48.0 title: Progress description: Show percent completion with a progress bar. name: progress component: Progress package: progress demoName: Progress Installation Usage API Reference components/progress/2.0.0 title: Progress description: Show percent completion with a progress bar name: progress component: Progress package: progress demoName: Progress Installation Usage API Reference components/radio-group/1.2.0 title: RadioGroup description: A group of radio buttons name: radio-group component: RadioGroup package: radio-group demoName: RadioGroup Installation Usage API Reference API Reference components/radio-group/1.3.0 title: RadioGroup description: Use in a form to allow selecting one option from multiple. name: radio-group component: RadioGroup package: radio-group demoName: RadioGroup Installation Usage API Reference components/radio-group/2.0.0 title: RadioGroup description: Use in a form to allow selecting one option from multiple name: radio-group component: RadioGroup package: radio-group demoName: RadioGroup Installation Usage API Reference components/roving-focus/2.0.0 title: RovingFocusGroup description: Manage keyboard navigation within a group of focusable elements. name: roving-focus component: RovingFocusGroup package: roving-focus Installation Usage How It Works Orientation Looping Navigation Controlled Tab Stop Non-Focusable Items Entry Focus Control API Reference Keyboard Navigation Usage in Components Tabs RadioGroup ToggleGroup components/scroll-view/1.0.0 title: ScrollView description: React Native ScrollView with Tamagui props. name: scrollView component: ScrollView package: scroll-view demoName: ScrollView Installation Usage API Reference components/scroll-view/2.0.0 title: ScrollView description: React Native ScrollView with Tamagui props name: scrollView component: ScrollView package: scroll-view demoName: ScrollView Installation Usage API Reference components/select/1.0.0 title: Select description: A simple select component name: select component: Select package: select demoName: Select components/select/1.128.0 title: Select description: Show a menu of items that users can select from. name: select component: Select package: select demoName: Select Installation Anatomy API Reference components/select/1.141.0 title: Select description: Show a menu of items that users can select from. name: select component: Select package: select demoName: Select Installation Anatomy Server-Side Rendering (SSR) API Reference components/select/1.19.0 title: Select description: A simple select component name: select component: Select package: select demoName: Select Anatomy API Reference components/select/1.40.0 title: Select description: Show a menu of items that users can select from. name: select component: Select package: select demoName: Select Installation Anatomy API Reference components/select/2.0.0 title: Select description: Show a menu of items that users can select from name: select component: Select package: select demoName: Select Installation Anatomy API Reference Performance components/separator/1.0.0 title: Separator description: Create borders between components. name: separator component: Separator package: separator demoName: Separator Installation Usage API Reference components/separator/2.0.0 title: Separator description: Create borders between components name: separator component: Separator package: separator demoName: Separator Installation Usage API Reference components/shapes/1.0.0 title: Shapes description: Easy to use Square and Circle. name: shapes component: Square package: shapes demoName: Shapes Installation Usage API Reference components/shapes/2.0.0 title: Shapes description: Easy to use Square and Circle name: shapes component: Square package: shapes demoName: Shapes Installation Usage API Reference components/sheet/1.0.0 title: Sheet description: A simple sheet component name: sheet component: Sheet package: sheet demoName: Sheet components/sheet/1.116.0 title: Sheet description: A simple sheet component name: sheet component: Sheet package: sheet demoName: Sheet Installation Anatomy Snap points Unstyled Headless with createSheet Native support API Reference Notes components/sheet/1.123.18 title: Sheet description: A bottom sheet that animates. name: sheet component: Sheet package: sheet demoName: Sheet Installation components/sheet/1.130.0 title: Sheet description: A bottom sheet that animates. name: sheet component: Sheet package: sheet demoName: Sheet Installation components/sheet/1.21.0 title: Sheet description: A simple sheet component name: sheet component: Sheet package: sheet demoName: Sheet components/sheet/1.27.0 title: Sheet description: A simple sheet component name: sheet component: Sheet package: sheet demoName: Sheet Installation Anatomy Unstyled Headless with createSheet Native support API Reference Notes components/sheet/1.59.0 title: Sheet description: A simple sheet component name: sheet component: Sheet package: sheet demoName: Sheet Installation Anatomy Snap points Unstyled Headless with createSheet Native support API Reference Notes components/sheet/1.9.18 title: Sheet description: A simple sheet component name: sheet component: Sheet package: sheet demoName: Sheet components/sheet/2.0.0 title: Sheet description: A bottom sheet that animates name: sheet component: Sheet package: sheet demoName: Sheet Installation Anatomy API Reference Native Gesture Handler Integration Notes Native Support components/slider/1.0.0 title: Slider description: A simple slider component name: slider component: Slider package: slider demoName: Slider Installation Usage API Reference components/slider/1.45.0 title: Slider description: Drag to set values, vertically or horizontally. name: slider component: Slider package: slider demoName: Slider Installation Usage API Reference components/slider/2.0.0 title: Slider description: Drag to set values, vertically or horizontally name: slider component: Slider package: slider demoName: Slider Installation Usage Vertical Slider on iOS API Reference components/spinner/1.0.0 title: Spinner description: Render a loading indicator. name: spinner component: Spinner demoName: Spinner Installation API Reference components/spinner/2.0.0 title: Spinner description: Render a loading indicator name: spinner component: Spinner package: spinner demoName: Spinner Installation Usage API Reference components/stacks/1.0.0 title: Stacks description: An optional base for creating flex-based layouts. name: stacks component: Stacks package: stacks demoName: Stacks Installation API Reference components/stacks/2.0.0 title: Stacks description: An optional base for creating flex-based layouts name: stacks component: Stacks package: stacks demoName: Stacks Installation Usage API Reference components/switch/1.0.0 title: Switch description: A simple switch component name: switch component: Switch package: switch demoName: Switch components/switch/1.28.0 title: Switch description: A simple switch component name: switch component: Switch package: switch demoName: Switch Installation Usage API Reference components/switch/1.58.0 title: Switch description: A simple switch component name: switch component: Switch package: switch demoName: Switch Installation Usage Headless with createSwitch API Reference components/switch/1.89.0 title: Switch description: A toggle between two states. name: switch component: Switch package: switch demoName: Switch Installation Usage API Reference components/switch/2.0.0 title: Switch description: A toggle between two states name: switch component: Switch package: switch demoName: Switch Installation Usage API Reference components/tabs/1.125.35 title: Tabs description: Use in pages to manage sub-pages. name: tabs component: Tabs package: tabs demoName: Tabs Installation Usage API Reference Examples components/tabs/1.7.0 title: Tabs description: Use in pages to manage sub-pages. name: tabs component: Tabs package: tabs demoName: Tabs Usage API Reference Examples components/tabs/2.0.0 title: Tabs description: Use in pages to manage sub-pages name: tabs component: Tabs package: tabs demoName: Tabs Installation Usage API Reference Examples components/tamagui-image/1.0.0 title: Image description: Web compatible and super light image component with Tamagui style props. name: html component: Image package: image-next demoName: WebNativeImageDemo Installation Usage API Reference components/tamagui-image/2.0.0 title: Image description: Web compatible and super light image component with Tamagui style props name: tamagui-image component: Image package: image demoName: WebNativeImageDemo Installation Usage API Reference components/text/1.0.0-alpha title: Text description: Text, Sized Text and Paragraph show one way to build a design system. name: text component: Paragraph demoName: Text SizableText Paragraph components/text/1.0.0 title: Text description: Text primitives with themes custom to each font. name: text component: Paragraph package: text demoName: Text Installation Usage Text SizableText Paragraph components/text/2.0.0 title: Text description: Text primitives with themes custom to each font name: text component: Paragraph package: text demoName: Text Installation Usage Text SizableText Paragraph Inline Text Elements Text Truncation API Reference components/toast/1.11.3 title: Toast description: A toast component with native features name: toast component: Toast package: toast demoName: Toast Installation Usage API FAQ components/toast/1.13.0 title: Toast description: A toast component with native features name: toast component: Toast package: toast demoName: Toast Installation Usage API FAQ components/toast/1.15.15 title: Toast description: A toast component with native features name: toast component: Toast package: toast demoName: Toast Installation Anatomy API Reference Examples components/toast/1.8.0 title: Toast description: A toast component with native features name: toast component: Toast package: toast demoName: Toast Install Anatomy Usage API components/toast/1.83.0 title: Toast description: Use to show feedback to user interactions. name: toast component: Toast package: toast demoName: Toast Installation Anatomy API Reference Examples components/toast/1.9.1 title: Toast description: A toast component with native features name: toast component: Toast package: toast demoName: Toast Usage API FAQ components/toast/2.0.0 title: Toast description: Use to show feedback to user interactions. name: toast component: Toast package: toast demoName: ToastV1 Installation Anatomy API Reference Examples components/toast-2/2.0.0 title: Toast v2 description: Beautiful, accessible toasts with smooth animations and gesture support. name: toast-2 component: Toast package: toast demoName: Toast Installation Quick Start Anatomy API Features Toaster (All-in-One) components/toggle-group/1.10.0 title: ToggleGroup description: Two-state buttons that can be toggled on or off. name: toggleGroup component: ToggleGroup package: toggle-group demoName: ToggleGroup Installation Usage API Reference components/toggle-group/2.0.0 title: ToggleGroup description: Two-state buttons that can be toggled on or off name: toggleGroup component: ToggleGroup package: toggle-group demoName: ToggleGroup Installation Usage API Reference components/tooltip/1.0.0 title: Tooltip description: A simple tooltip component name: tooltip component: Tooltip package: tooltip demoName: Tooltip Installation Anatomy API Reference components/tooltip/1.105.0 title: Tooltip description: A simple tooltip component name: tooltip component: Tooltip package: tooltip demoName: Tooltip Installation Anatomy API Reference components/tooltip/1.122.0 title: Tooltip description: A tooltip on web, with only accessibility output on native. name: tooltip component: Tooltip package: tooltip demoName: Tooltip Installation Anatomy API Reference components/tooltip/2.0.0 title: Tooltip description: A tooltip on web, with only accessibility output on native name: tooltip component: Tooltip package: tooltip demoName: Tooltip Installation Anatomy API Reference Scoping components/unspaced/1.0.0 title: Unspaced description: Avoids spacing for children inside a spacing container. name: html component: Unspaced components/unspaced/2.0.0 title: Unspaced description: Avoids spacing for children inside a spacing container name: unspaced component: Unspaced package: core Usage components/visually-hidden/1.0.0 title: Visually Hidden description: Hide content accessibly. name: html component: VisuallyHidden Installation Usage components/visually-hidden/2.0.0 title: Visually Hidden description: Hide content accessibly name: visually-hidden component: VisuallyHidden package: visually-hidden Installation Usage components/z-index/2.0.0 title: Z-Index & Stacking description: How Tamagui automatically stacks overlays and floating content name: z-index How It Works When to Set zIndex Component Defaults Stacking Hierarchy Nested Stacking Technical Details Portal Component core/animate-presence title: AnimatePresence description: Animate components as they mount and unmount Basic Usage Enter/Exit Transitions The custom prop API Reference See Also Animations Overview Animation Drivers core/animation-drivers title: Animation Drivers description: Choose and configure animation drivers for your platform Using Config v5 CSS Driver React Native Driver Reanimated Driver Motion Driver Swapping Drivers See Also Animations Overview AnimatePresence Config v5 core/animations-css title: CSS Driver description: Lightweight CSS transition-based animations Installation Configuration How it Works Animation Configuration When to Use Example See Also Animations Introduction React Native Driver Motion Driver Reanimated Driver core/animations-motion title: Motion Driver description: High-performance web animations with WAAPI Installation Configuration How it Works Animation Configuration Highlights Platform-Specific Configuration See Also Animations Introduction CSS Driver React Native Driver Reanimated Driver Motion Documentation core/animations-react-native title: React Native Driver description: Spring-based animations using React Native Animated Installation Configuration Animation Configuration When to Use Platform-Specific Configuration Example See Also Animations Introduction CSS Driver Motion Driver Reanimated Driver core/animations-reanimated title: Reanimated Driver description: Advanced off-thread animations with Reanimated Installation Configuration How it Works Animation Configuration When to Use Platform-Specific Configuration Example Zero Re-renders Advanced Features See Also Animations Introduction CSS Driver React Native Driver Motion Driver Reanimated Documentation core/animations title: Animations description: Swap out animation drivers per-platform or at runtime Installation Usage What to know when animating See Also AnimatePresence Animation Drivers core/config-v4 title: Quick Config description: Easy config and themes with @tamagui/config/v4 theme-builder guide core/config-v5 title: 'Config v5' description: Modern config and themes with @tamagui/config/v5 Choosing an Animation Driver Choosing an Animation Driver Customizing Themes with createV5Theme Theme Values Color Themes Templates Component Themes Settings Media Queries Shorthands Tree Shaking Themes Summary: v4 to v5 Migration Checklist core/configuration title: Configuration description: Set up media queries, tokens, themes, and more. In more detail animations media queries themes tokens settings shorthands TamaguiProvider Tokens @tamagui/animations-css @tamagui/animations-react-native @tamagui/animations-reanimated @tamagui/animations-motion core/create-styled-context title: createStyledContext description: Share variant props across compound components core/exports title: 'Other exports' description: Helpful functions and constants Constants Helpers Hooks Type Helpers core/font-language title: FontLanguage description: Using custom fonts for each language core/server-rendering title: Server Rendering description: Advanced SSR, hydration, and client-only rendering in Tamagui How It Works Opting Out Configuration Component useMedia and SSR SSR Hooks Best Practices Package Reference See Also Configuration useMedia Themes core/styled title: styled() description: Extend and build custom and optimizable components Variants Using on the web render styleable accept core/theme title: Theme description: Change themes contextually Usage Defining Themes core/tokens title: Tokens description: Accessing and using tokens Getting Tokens Using Tokens with Components Specific Tokens core/use-media title: useMedia description: Respond to different screen sizes core/use-theme title: useTheme description: Creating and using theme values Using outside of styling Changing the theme at the hook level core/variants title: Variants description: Simple typed prop styles through styled() Why Variants? Variants core/view-and-text title: View & Text description: Your base components guides/cli title: Tamagui CLI description: Command-line tools for building, checking, and managing Tamagui projects Installation Commands Global Flags Examples Troubleshooting guides/create-tamagui-app title: Bootstrapping description: Starter kits for React Native Expo Router Takeout 馃摝 Included packages (starter-free) 馃梻 Folder layout 馃弫 Start the app 馃啎 Add new dependencies guides/design-systems title: Design Systems description: Put together your own design system. Step 1: Create a package Step 2: Create your design system Step 3: Define and export components Step 4: Set up your build Step 5: Test it out guides/developing title: Developing with Tamagui description: Tips and tricks guides/expo title: Expo Guide description: How to set up Tamagui with Expo Install Metro configuration guide Loading fonts First time starting Expo guides/how-to-build-a-button title: How to Build a Button description: Learn how to create a powerful yet simple API for a button with Tamagui and compound components hero: HowToBuildAButton demoName: BuildAButton guides/how-to-upgrade title: Upgrading from v1 to v2 description: A comprehensive guide for migrating your Tamagui project from v1 to v2 Prerequisites 1. Update Dependencies 2. Config Migration (v4 to v5) 3. Prop Renames 4. Shadow Migration 5. Accessibility Props 6. Component API Changes 7. Removed APIs 8. Native Setup 9. Build Config 10. Quick Reference: Find-and-Replace Patterns 11. New Features Worth Knowing Migration Checklist guides/metro title: Metro Guide description: How to set up Tamagui with Metro Basic Setup With Metro Plugin (Recommended) Optimized Production Builds Debugging guides/next-js title: Next.js Guide description: How to set up Tamagui with Next.js Setup Themes NextThemeProvider For Older Versions Pages Router App Router (Webpack) guides/one title: One Guide description: How to set up Tamagui with One Install Configuration Setup Tamagui Provider Usage Themes Performance Next Steps guides/theme-builder title: Creating Themes with Tamagui description: Learn how to create a suite of themes for a Tamagui app demoName: ThemeBuilder createV5Theme createThemes createThemeBuilder Concepts guides/vite title: Vite Guide description: How to set up Tamagui with Vite Install guides/webpack title: Webpack Guide description: How to set up Tamagui with Webpack Usage intro/benchmarks title: Benchmarks description: Performance tests and comparisons React Native Web intro/colors title: Colors description: Color palettes and customization options intro/compiler-install title: Tamagui Compiler description: Adding the compiler to your apps Configuration with tamagui.build.ts Install Props intro/errors title: Errors description: Common error messages and how to resolve them intro/installation title: Installation description: Get Tamagui set up, step by step Requirements Installation ## What is Tamagui Complete Documentation's llms.txt? Tamagui Complete Documentation publishes an `/llms.txt` file that provides AI systems with a structured index of its documentation. It follows the [llms.txt specification](https://llmstxt.org), organizing links to guides, API references, and tutorials under section headings so that LLMs like ChatGPT, Claude, and Gemini can quickly understand what Tamagui Complete Documentation offers and where to find details. Issues Spec 967 Sections 46 Links 1.0 MB Size ~269.2k Tokens Sections: components/accordion/1.0.0 路 title: Accordion description: A vertically stacked set of interactive headings with content. name: accordion component: Accordion package: accordion 路 Installation 路 Anatomy 路 API Reference 路 Examples 路 and 961 more ## Add Tamagui Complete Documentation Docs to Your AI Assistant Select your tool to see how to add Tamagui Complete Documentation's llms.txt as a documentation source. Cursor Windsurf Claude Code ChatGPT Zed Copilot 1. 1 Open any chat or composer panel 2. 2 Type @Docs and select "Add new doc" 3. 3 Paste the URL: https://tamagui.dev/llms.txt 4. 4 Wait for the green dot (indexing complete) 5. 5 Reference @Docs in chat when asking about Tamagui Complete Documentation Cursor crawls the URL and indexes all subpages. Add a trailing slash to index child pages too. ## Spec Compliance 999 errors ## Frequently Asked Questions Where is Tamagui Complete Documentation's llms.txt file? Tamagui Complete Documentation publishes its llms.txt at https://tamagui.dev/llms.txt. This file provides a structured, markdown-formatted index of Tamagui Complete Documentation's documentation that AI systems can consume to understand the project's APIs, guides, and references. How do I use Tamagui Complete Documentation's llms.txt with AI coding assistants? Copy the llms.txt content and paste it into your AI assistant (Cursor, Windsurf, Claude, ChatGPT) as context. This gives the AI an accurate map of Tamagui Complete Documentation's documentation so it can provide better code suggestions and answers about Tamagui Complete Documentation. What does Tamagui Complete Documentation's llms.txt contain? Tamagui Complete Documentation's llms.txt contains 967 sections and 46 documentation links in 1.0 MB (~269.2k tokens). Key sections include components/accordion/1.0.0, title: Accordion description: A vertically stacked set of interactive headings with content. name: accordion component: Accordion package: accordion, Installation, Anatomy, API Reference, Examples. How many tokens does Tamagui Complete Documentation's llms.txt use? The concise llms.txt index is approximately 269.2k tokens (1.0 MB). Most AI assistants can fit this within their context window. For the full expanded documentation, look for an llms-full.txt variant which embeds all content inline. What is Tamagui Complete Documentation? Tamagui is a complete UI solution for React Native and Web, with a fully-featured UI kit, styling engine, and optimizing compiler.. Tamagui Complete Documentation's llms.txt file helps AI systems understand this by providing a structured overview of its documentation, making it easier for developers to get accurate AI-assisted help when working with Tamagui Complete Documentation. Can I generate an llms.txt for my own project? Yes. Use the free llms.txt generator at mdream.dev/tools/llms-txt/generator to crawl your site and produce a spec-compliant llms.txt file. You can also validate existing files with the llms.txt validator. ## Browse More llms.txt Files [openmediavault](https://mdream.dev/llms-txt/tamagui/llms-txt/openmediavault) [Knock Documentation](https://mdream.dev/llms-txt/tamagui/llms-txt/knock) [Nylas | Powerful Communication APIs Unlock the power of your communications data. The Nylas communication APIs remove complexity & empower teams to create seamless user experiences.](https://mdream.dev/llms-txt/tamagui/llms-txt/nylas-mail) [EventCatalog EventCatalog is an Open Source project that helps you document your messages, services and domains.](https://mdream.dev/llms-txt/tamagui/llms-txt/eventcatalog) [Hurl Documentation With `\[Query\]` section, params don't need to be URL escaped.](https://mdream.dev/llms-txt/tamagui/llms-txt/hurl) [Nx Nx is an AI-first monorepo platform that connects your editor to CI. It helps you deliver fast without breaking things by optimizing builds, scaling CI, and fixing failed PRs.](https://mdream.dev/llms-txt/tamagui/llms-txt/nx) [Dagster Docs](https://mdream.dev/llms-txt/tamagui/llms-txt/dagster) [The JavaScript Oxidation Compiler The JavaScript Oxidation Compiler](https://mdream.dev/llms-txt/tamagui/llms-txt/oxc) [View all 99 projects ](https://mdream.dev/llms-txt/tamagui/llms-txt) ## Related Tools [

llms.txt Generator

Generate an llms.txt for your own project.](https://mdream.dev/llms-txt/tamagui/tools/llms-txt/generator) [

llms.txt Validator

Validate your llms.txt against the official spec.](https://mdream.dev/llms-txt/tamagui/tools/llms-txt/validator) 漏 2026 [Harlan Wilton](https://github.com/harlan-zw) 路 [MIT](https://github.com/harlan-zw/mdream/blob/main/license) [GitHub](https://github.com/harlan-zw/mdream) [Discord](https://discord.com/invite/275MBUBvgP)