# HeroUI v3 (Previously NextUI) - Beautiful by default, customizable by design. > Markdown mirror of DialtoneApp's public top-site detail page for `heroui.com`. URL: https://dialtoneapp.com/top-sites/heroui.com/index.md Canonical HTML: https://dialtoneapp.com/top-sites/heroui.com ## Summary - Domain: `heroui.com` - Website: https://heroui.com - Description: ai readable | score 20 | purchase read only - Label: ai_readable - Payment surface: Not available - Purchase boundary: read_only - Control boundary: unknown - Rank: 379893 ## robots ~~~text # * User-agent: * Allow: / # Host Host: https://heroui.com # Sitemaps Sitemap: https://heroui.com/sitemap.xml ~~~ ## llms ~~~text # HeroUI v3 Documentation > A set of beautiful, customizable React and React Native components that stay maintained and up to date. HeroUI v3 is an open-source UI component library for building modern web and mobile applications. Built on [Tailwind CSS v4](https://tailwindcss.com/) and [React Aria Components](https://react-spectrum.adobe.com/react-aria/), HeroUI provides accessible, customizable components with smooth animations and polished details. **Key Features:** - Beautiful by default - Professional look out of the box, no extra styling needed - Accessible - Built with accessibility in mind, following WAI-ARIA guidelines - Flexible - Each component is made of customizable parts - Developer-friendly - Fully typed APIs, predictable patterns, and excellent autocompletion - Maintained - Regular updates, bug fixes, and new features **Technology Stack:** - React 19+ for web components - React Native for mobile components - Tailwind CSS v4 for styling - TypeScript for type safety ## Available Platforms - **React (Web)**: [/react/llms.txt](https://www.heroui.com/react/llms.txt) - React component library for web applications - **React Native**: [/native/llms.txt](https://www.heroui.com/native/llms.txt) - React Native component library for mobile applications ## Documentation Index ### React - [Introduction](https://www.heroui.com/docs/react/getting-started): An open-source UI component library for building beautiful and accessible user interfaces. - [All Components](https://www.heroui.com/docs/react/components): Explore the full list of components available in the library. More are on the way. - [Migration (for AI assistants)](https://www.heroui.com/docs/react/migration/agent-index): Entry point for AI assistants helping migrate HeroUI v2 to v3 - [Hooks](https://www.heroui.com/docs/react/migration/hooks): Migration guide for HeroUI hooks from v2 to v3 - [Migration](https://www.heroui.com/docs/react/migration): Complete guide to migrate your HeroUI v2 application to v3 - [Styling & Theming](https://www.heroui.com/docs/react/migration/styling): Complete guide to styling changes and theming system migration from HeroUI v2 to v3 - [All Releases](https://www.heroui.com/docs/react/releases): All updates and changes to HeroUI v3, including new features, fixes, and breaking changes. - [v3.0.0-alpha.32](https://www.heroui.com/docs/react/releases/v3-0-0-alpha-32): Card component redesign, CloseButton, MCP Server for AI assistants - [v3.0.0-alpha.33](https://www.heroui.com/docs/react/releases/v3-0-0-alpha-33): RAC upgrade, Tabs indicator redesign, Switch size variant, Related showcase - [v3.0.0-alpha.34](https://www.heroui.com/docs/react/releases/v3-0-0-alpha-34): Essentials for building forms with a clean API Form, TextField, RadioGroup, Label, Input, Fieldset and more. - [v3.0.0-alpha.35](https://www.heroui.com/docs/react/releases/v3-0-0-alpha-35): React Server Components support for compound components, React 19 improvements, and critical bug fixes. - [v3.0.0-beta.1](https://www.heroui.com/docs/react/releases/v3-0-0-beta-1): Major redesign with new design system, 8 new components, and improved developer experience. - [v3.0.0-beta.2](https://www.heroui.com/docs/react/releases/v3-0-0-beta-2): Six new components (AlertDialog, ComboBox, Dropdown, InputGroup, Modal, NumberField), Select API improvements, and component refinements. - [v3.0.0-beta.3](https://www.heroui.com/docs/react/releases/v3-0-0-beta-3): Seven new components, fullWidth and hideSeparator support, style fixes, and breaking changes for AlertDialog/Modal backdrop variants and asChild prop removal. - [v3.0.0-beta.4](https://www.heroui.com/docs/react/releases/v3-0-0-beta-4): New Theme Builder, three new components (Autocomplete, Breadcrumbs, Toast), Tabs secondary variant, Input/InputGroup variants, and various improvements. - [v3.0.0-beta.6](https://www.heroui.com/docs/react/releases/v3-0-0-beta-6): 6 new color components (ColorPicker, ColorArea, ColorSlider, ColorField, ColorSwatch, ColorSwatchPicker), toast improvements, and various style fixes. - [v3.0.0-beta.7](https://www.heroui.com/docs/react/releases/v3-0-0-beta-7): 4 new components (Calendar, RangeCalendar, DatePicker, DateRangePicker) and APIs improvements. - [v3.0.0-beta.8](https://www.heroui.com/docs/react/releases/v3-0-0-beta-8): 3 new components (Badge, Pagination, Table), DateField improvements, and key API/style fixes. - [v3.0.0-rc.1](https://www.heroui.com/docs/react/releases/v3-0-0-rc-1): 7 new components (Drawer, ToggleButton, ToggleButtonGroup, Meter, ProgressBar, ProgressCircle, Toolbar), Table & ListBox virtualization, ButtonGroup improvements, and bug fixes. - [Introducing HeroUI v3](https://www.heroui.com/docs/react/releases/v3-0-0): A ground-up rewrite for React and React Native. 75+ web components, 37 native components, Tailwind CSS v4, React Aria, compound architecture, and built for AI-assisted development. - [v3.0.2](https://www.heroui.com/docs/react/releases/v3-0-2): Bug fixes, smoother Drawer transitions, new --backdrop theme variable, and style refinements for triggers, arrows, and tags. - [v3.0.3](https://www.heroui.com/docs/react/releases/v3-0-3): RAC 1.17 with 90% fewer deps, expandable Table rows, Apache 2.0 license, useTheme hook, DOM polymorphic render-prop API, and bug fixes. - [Animation](https://www.heroui.com/docs/react/getting-started/animation): Add smooth animations and transitions to HeroUI v3 components - [Colors](https://www.heroui.com/docs/react/getting-started/colors): Color palette and theming system for HeroUI v3 - [Composition](https://www.heroui.com/docs/react/getting-started/composition): Build flexible UI with component composition patterns - [Styling](https://www.heroui.com/docs/react/getting-started/styling): Style HeroUI components with CSS, Tailwind, or CSS-in-JS - [Theming](https://www.heroui.com/docs/react/getting-started/theming): Customize HeroUI's design system with CSS variables and global styles - [Design Principles](https://www.heroui.com/docs/react/getting-started/design-principles): Core principles that guide HeroUI v3's design and development - [Quick Start](https://www.heroui.com/docs/react/getting-started/quick-start): Get started with HeroUI v3 in minutes - [Agent Skills](https://www.heroui.com/docs/react/getting-started/agent-skills): Enable AI assistants to build UIs with HeroUI v3 components - [AGENTS.md](https://www.heroui.com/docs/react/getting-started/agents-md): Download HeroUI v3 React documentation for AI coding agents - [LLMs.txt](https://www.heroui.com/docs/react/getting-started/llms-txt): Enable AI assistants like Claude, Cursor, and Windsurf to understand HeroUI v3 - [MCP Server](https://www.heroui.com/docs/react/getting-started/mcp-server): Access HeroUI v3 documentation directly in your AI assistant - [ButtonGroup](https://www.heroui.com/docs/react/components/button-group): Group related buttons together with consistent styling and spacing - [Button](https://www.heroui.com/docs/react/components/button): A clickable button component with multiple variants and states - [CloseButton](https://www.heroui.com/docs/react/components/close-button): Button component for closing dialogs, modals, or dismissing content - [ToggleButtonGroup](https://www.heroui.com/docs/react/components/toggle-button-group): Groups multiple ToggleButtons into a unified control, allowing users to select one or multiple options. - [ToggleButton](https://www.heroui.com/docs/react/components/toggle-button): An interactive toggle control for on/off or selected/unselected states - [Dropdown](https://www.heroui.com/docs/react/components/dropdown): A dropdown displays a list of actions or options that a user can choose - [ListBox](https://www.heroui.com/docs/react/components/list-box): A listbox displays a list of options and allows a user to select one or more of them - [TagGroup](https://www.heroui.com/docs/react/components/tag-group): A focusable list of tags with support for keyboard navigation, selection, and removal - [ColorArea](https://www.heroui.com/docs/react/components/color-area): A 2D color picker that allows users to select colors from a gradient area - [ColorField](https://www.heroui.com/docs/react/components/color-field): Color input field with labels, descriptions, and validation built on React Aria ColorField - [ColorPicker](https://www.heroui.com/docs/react/components/color-picker): A composable color picker that synchronizes color value between multiple color components - [ColorSlider](https://www.heroui.com/docs/react/components/color-slider): A color slider allows users to adjust an individual channel of a color value - [ColorSwatchPicker](https://www.heroui.com/docs/react/components/color-swatch-picker): A list of color swatches that allows users to select a color from a predefined palette. - [ColorSwatch](https://www.heroui.com/docs/react/components/color-swatch): A visual preview of a color value with accessibility support - [Slider](https://www.heroui.com/docs/react/components/slider): A slider allows a user to select one or more values within a range - [Switch](https://www.heroui.com/docs/react/components/switch): A toggle switch component for boolean states - [Badge](https://www.heroui.com/docs/react/components/badge): Displays a small indicator positioned relative to another element, commonly used for notification counts, status dots, and labels - [Chip](https://www.heroui.com/docs/react/components/chip): Small informational badges for displaying labels, statuses, and categories - [Table](https://www.heroui.com/docs/react/components/table): Tables display structured data in rows and columns with support for sorting, selection, column resizing, and infinite scrolling. - [Calendar](https://www.heroui.com/docs/react/components/calendar): Composable date picker with month grid, navigation, and year picker support built on React Aria Calendar - [DateField](https://www.heroui.com/docs/react/components/date-field): Date input field with labels, descriptions, and validation built on React Aria DateField - [DatePicker](https://www.heroui.com/docs/react/components/date-picker): Composable date picker built on React Aria DatePicker with DateField and Calendar composition - [DateRangePicker](https://www.heroui.com/docs/react/components/date-range-picker): Composable date range picker built on React Aria DateRangePicker with DateField and RangeCalendar composition - [RangeCalendar](https://www.heroui.com/docs/react/components/range-calendar): Composable date range picker with month grid, navigation, and year picker support built on React Aria RangeCalendar - [TimeField](https://www.heroui.com/docs/react/components/time-field): Time input field with labels, descriptions, and validation built on React Aria TimeField - [Alert](https://www.heroui.com/docs/react/components/alert): Display important messages and notifications to users with status indicators - [Meter](https://www.heroui.com/docs/react/components/meter): A meter represents a quantity within a known range, or a fractional value. - [ProgressBar](https://www.heroui.com/docs/react/components/progress-bar): A progress bar shows either determinate or indeterminate progress of an operation over time. - [ProgressCircle](https://www.heroui.com/docs/react/components/progress-circle): A circular progress indicator that shows determinate or indeterminate progress. - [Skeleton](https://www.heroui.com/docs/react/components/skeleton): Skeleton is a placeholder to show a loading state and the expected shape of a component. - [Spinner](https://www.heroui.com/docs/react/components/spinner): A loading indicator component to show pending states - [CheckboxGroup](https://www.heroui.com/docs/react/components/checkbox-group): A checkbox group component for managing multiple checkbox selections - [Checkbox](https://www.heroui.com/docs/react/components/checkbox): Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected. - [Description](https://www.heroui.com/docs/react/components/description): Provides supplementary text for form fields and other components - [ErrorMessage](https://www.heroui.com/docs/react/components/error-message): A low-level error message component for displaying errors - [FieldError](https://www.heroui.com/docs/react/components/field-error): Displays validation error messages for form fields - [Fieldset](https://www.heroui.com/docs/react/components/fieldset): Group related form controls with legends, descriptions, and actions - [Form](https://www.heroui.com/docs/react/components/form): Wrapper component for form validation and submission handling - [InputGroup](https://www.heroui.com/docs/react/components/input-group): Group related input controls with prefix and suffix elements for enhanced form fields - [InputOTP](https://www.heroui.com/docs/react/components/input-otp): A one-time password input component for verification codes and secure authentication - [Input](https://www.heroui.com/docs/react/components/input): Primitive single-line text input component that accepts standard HTML attributes - [Label](https://www.heroui.com/docs/react/components/label): Renders an accessible label associated with form controls - [NumberField](https://www.heroui.com/docs/react/components/number-field): Number input fields with increment/decrement buttons, validation, and internationalized formatting - [RadioGroup](https://www.heroui.com/docs/react/components/radio-group): Radio group for selecting a single option from a list - [SearchField](https://www.heroui.com/docs/react/components/search-field): Search input field with clear button and search icon - [TextArea](https://www.heroui.com/docs/react/components/text-area): Primitive multiline text input component that accepts standard HTML attributes - [TextField](https://www.heroui.com/docs/react/components/text-field): Composition-friendly text fields with labels, descriptions, and inline validation - [Card](https://www.heroui.com/docs/react/components/card): Flexible container component for grouping related content and actions - [Separator](https://www.heroui.com/docs/react/components/separator): Visually divide content sections - [Surface](https://www.heroui.com/docs/react/components/surface): Container component that provides surface-level styling and context for child components - [Toolbar](https://www.heroui.com/docs/react/components/toolbar): A container for interactive controls with arrow key navigation. - [Avatar](https://www.heroui.com/docs/react/components/avatar): Display user profile images with customizable fallback content - [Accordion](https://www.heroui.com/docs/react/components/accordion): A collapsible content panel for organizing information in a compact space - [Breadcrumbs](https://www.heroui.com/docs/react/components/breadcrumbs): Navigation breadcrumbs showing the current page's location within a hierarchy - [DisclosureGroup](https://www.heroui.com/docs/react/components/disclosure-group): Container that manages multiple Disclosure items with coordinated expanded states - [Disclosure](https://www.heroui.com/docs/react/components/disclosure): A disclosure is a collapsible section with a header containing a heading and a trigger button, and a panel that wraps the content. - [Link](https://www.heroui.com/docs/react/components/link): A styled anchor component for navigation with built-in icon support - [Pagination](https://www.heroui.com/docs/react/components/pagination): Page navigation with composable page links, previous/next buttons, and ellipsis indicators - [Tabs](https://www.heroui.com/docs/react/components/tabs): Tabs organize content into multiple sections and allow users to navigate between them. - [AlertDialog](https://www.heroui.com/docs/react/components/alert-dialog): Modal dialog for critical confirmations requiring user attention and explicit action - [Drawer](https://www.heroui.com/docs/react/components/drawer): Slide-out panel for supplementary content and actions - [Modal](https://www.heroui.com/docs/react/components/modal): Dialog overlay for focused user interactions and important content - [Popover](https://www.heroui.com/docs/react/components/popover): Displays rich content in a portal triggered by a button or any custom element - [Toast](https://www.heroui.com/docs/react/components/toast): Display temporary notifications and messages to users with automatic dismissal and customizable placement - [Tooltip](https://www.heroui.com/docs/react/components/tooltip): Displays informative text when users hover over or focus on an element - [Autocomplete](https://www.heroui.com/docs/react/components/autocomplete): An autocomplete combines a select with filtering, allowing users to search and select from a list of options - [ComboBox](https://www.heroui.com/docs/react/components/combo-box): A combo box combines a text input with a listbox, allowing users to filter a list of options to items matching a query - [Select](https://www.heroui.com/docs/react/components/select): A select displays a collapsible list of options and allows a user to select one of them - [Kbd](https://www.heroui.com/docs/react/components/kbd): Display keyboard shortcuts and key combinations - [ScrollShadow](https://www.heroui.com/docs/react/components/scroll-shadow): Apply visual shadows to indicate scrollable content overflow with automatic detection of scroll position. - [Agent Skills](https://www.heroui.com/docs/react/migration/agent-skills): Enable AI assistants to migrate HeroUI v2 to v3 - [AGENTS.md](https://www.heroui.com/docs/react/migration/agents-md): Download HeroUI v2 to v3 migration docs for AI coding agents - [MCP Server](https://www.heroui.com/docs/react/migration/mcp-server): Access HeroUI v2 to v3 migration guides in your AI assistant - [Accordion](https://www.heroui.com/docs/react/migration/accordion): Migration guide for Accordion from HeroUI v2 to v3 - [Alert](https://www.heroui.com/docs/react/migration/alert): Migration guide for Alert from HeroUI v2 to v3 - [Autocomplete](https://www.heroui.com/docs/react/migration/autocomplete): Migration guide for Autocomplete from HeroUI v2 to v3 - [Avatar](https://www.heroui.com/docs/react/migration/avatar): Migration guide for Avatar from HeroUI v2 to v3 - [Badge](https://www.heroui.com/docs/react/migration/badge): Migration guide for Badge from HeroUI v2 to v3 - [Breadcrumbs](https://www.heroui.com/docs/react/migration/breadcrumbs): Migration guide for Breadcrumbs from HeroUI v2 to v3 - [ButtonGroup](https://www.heroui.com/docs/react/migration/button-group): Migration guide for ButtonGroup from HeroUI v2 to v3 - [Button](https://www.heroui.com/docs/react/migration/button): Migration guide for Button from HeroUI v2 to v3 - [Calendar](https://www.heroui.com/docs/react/migration/calendar): Migration guide for Calendar from HeroUI v2 to v3 - [Card](https://www.heroui.com/docs/react/migration/card): Migration guide for Card from HeroUI v2 to v3 - [CheckboxGroup](https://www.heroui.com/docs/react/migration/checkbox-group): Migration guide for CheckboxGroup from HeroUI v2 to v3 - [Checkbox](https://www.heroui.com/docs/react/migration/checkbox): Migration guide for Checkbox from HeroUI v2 to v3 - [Chip](https://www.heroui.com/docs/react/migration/chip): Migration guide for Chip from HeroUI v2 to v3 - [CircularProgress](https://www.heroui.com/docs/react/migration/circular-progress): Migration guide for CircularProgress from HeroUI v2 to v3 (now ProgressCircle) - [Code](https://www.heroui.com/docs/react/migration/code): Migration guide for Code from HeroUI v2 to v3 - [DatePicker](https://www.heroui.com/docs/react/migration/date-picker): Migration guide for DatePicker from HeroUI v2 to v3 - [DateRangePicker](https://www.heroui.com/docs/react/migration/date-range-picker): Migration guide for DateRangePicker from HeroUI v2 to v3 - [DateInput](https://www.heroui.com/docs/react/migration/dateinput): Migration guide for DateInput to DateField from HeroUI v2 to v3 - [Divider](https://www.heroui.com/docs/react/migration/divider): Migration guide for Divider (renamed to Separator) from HeroUI v2 to v3 - [Drawer](https://www.heroui.com/docs/react/migration/drawer): Migration guide for Drawer from HeroUI v2 to v3 - [Dropdown](https://www.heroui.com/docs/react/migration/dropdown): Migration guide for Dropdown from HeroUI v2 to v3 - [Form](https://www.heroui.com/docs/react/migration/form): Migration guide for Form from HeroUI v2 to v3 - [Image](https://www.heroui.com/docs/react/migration/image): Migration guide for Image from HeroUI v2 to v3 - [InputOTP](https://www.heroui.com/docs/react/migration/input-otp): Migration guide for InputOTP from HeroUI v2 to v3 - [Input](https://www.heroui.com/docs/react/migration/input): Migration guide for Input from HeroUI v2 to v3 - [Kbd](https://www.heroui.com/docs/react/migration/kbd): Migration guide for Kbd from HeroUI v2 to v3 - [Link](https://www.heroui.com/docs/react/migration/link): Migration guide for Link from HeroUI v2 to v3 - [Listbox](https://www.heroui.com/docs/react/migration/listbox): Migration guide for Listbox (renamed to ListBox with a capital "B") from HeroUI v2 to v3 - [Modal](https://www.heroui.com/docs/react/migration/modal): Migration guide for Modal from HeroUI v2 to v3 - [Navbar](https://www.heroui.com/docs/react/migration/navbar): Migration guide for Navbar from HeroUI v2 to v3 - [NumberInput](https://www.heroui.com/docs/react/migration/numberinput): Migration guide for NumberInput to NumberField from HeroUI v2 to v3 - [Pagination](https://www.heroui.com/docs/react/migration/pagination): Migration guide for Pagination from HeroUI v2 to v3 - [Popover](https://www.heroui.com/docs/react/migration/popover): Migration guide for Popover from HeroUI v2 to v3 - [Progress](https://www.heroui.com/docs/react/migration/progress): Migration guide for Progress from HeroUI v2 to v3 (now ProgressBar) - [RadioGroup](https://www.heroui.com/docs/react/migration/radio-group): Migration guide for RadioGroup from HeroUI v2 to v3 - [Radio](https://www.heroui.com/docs/react/migration/radio): Migration guide for Radio from HeroUI v2 to v3 - [RangeCalendar](https://www.heroui.com/docs/react/migration/range-calendar): Migration guide for RangeCalendar from HeroUI v2 to v3 - [ScrollShadow](https://www.heroui.com/docs/react/migration/scroll-shadow): Migration guide for ScrollShadow from HeroUI v2 to v3 - [Select](https://www.heroui.com/docs/react/migration/select): Migration guide for Select from HeroUI v2 to v3 - [Skeleton](https://www.heroui.com/docs/react/migration/skeleton): Migration guide for Skeleton from HeroUI v2 to v3 - [Slider](https://www.heroui.com/docs/react/migration/slider): Migration guide for Slider from HeroUI v2 to v3 - [Snippet](https://www.heroui.com/docs/react/migration/snippet): Migration guide for Snippet from HeroUI v2 to v3 - [Spacer](https://www.heroui.com/docs/react/migration/spacer): Migration guide for Spacer from HeroUI v2 to v3 - [Spinner](https://www.heroui.com/docs/react/migration/spinner): Migration guide for Spinner from HeroUI v2 to v3 - [Switch](https://www.heroui.com/docs/react/migration/switch): Migration guide for Switch from HeroUI v2 to v3 - [Table](https://www.heroui.com/docs/react/migration/table): Migration guide for Table from HeroUI v2 to v3 - [Tabs](https://www.heroui.com/docs/react/migration/tabs): Migration guide for Tabs from HeroUI v2 to v3 - [TimeInput](https://www.heroui.com/docs/react/migration/timeinput): Migration guide for TimeInput to TimeField from HeroUI v2 to v3 - [Toast](https://www.heroui.com/docs/react/migration/toast): Migration guide for Toast from HeroUI v2 to v3 - [Tooltip](https://www.heroui.com/docs/react/migration/tooltip): Migration guide for Tooltip from HeroUI v2 to v3 - [User](https://www.heroui.com/docs/react/migration/user): Migration guide for User from HeroUI v2 to v3 - [Agent Migration Guide - Full Migration](https://www.heroui.com/docs/react/migration/agent-guide-full): Full migration guide for AI assistants helping migrate HeroUI v2 to v3 - [Agent Migration Guide - Incremental Migration with Coexistence](https://www.heroui.com/docs/react/migration/agent-guide-incremental): Incremental coexistence migration guide for AI assistants helping migrate HeroUI v2 to v3 - [Full Migration](https://www.heroui.com/docs/react/migration/full-migration): Step-by-step guide for migrating HeroUI v2 to v3 using full migration approach - [Incremental Migration](https://www.heroui.com/docs/react/migration/incremental-migration): Step-by-step guide for migrating HeroUI v2 to v3 incrementally while keeping both versions working side-by-side ### Native - [All Components](https://www.heroui.com/docs/native/components): Explore the full list of components available in HeroUI Native. More are on the way. - [Introduction](https://www.heroui.com/docs/native/getting-started): An open-source UI component library for building beautiful and accessible user interfaces. - [Beta 10](https://www.heroui.com/docs/native/releases/beta-10): Bottom Sheet component, PressableFeedback refactor, Animation API State Prop extension, use-theme-color multiple colors selection, and bug fixes. - [Beta 11](https://www.heroui.com/docs/native/releases/beta-11): Enhanced Bottom Sheet close coordination, Dialog swipe-to-dismiss fixes, TextField improvements, and PortalHost export for advanced use cases - [Beta 12](https://www.heroui.com/docs/native/releases/beta-12): InputOTP, Label, and Description components, Popover close fixes, controlled state improvements, border radius fixes, and variant style prop support - [Beta 13](https://www.heroui.com/docs/native/releases/beta-13): TextArea component, Button outline variant, Tabs improvements, form component decomposition, popup animation refactor, style class exports, and critical bug fixes - [All Releases](https://www.heroui.com/docs/native/releases): All updates and changes to HeroUI Native, including new features, fixes, and breaking changes. - [RC 1](https://www.heroui.com/docs/native/releases/rc-1): Alert component, standalone Radio component, Select TriggerIndicator, HeroUINativeProviderRaw, disableFullWindowOverlay prop, styles prop expansion, theme surface refactor - [RC 2](https://www.heroui.com/docs/native/releases/rc-2): SearchField, ListGroup, and Slider components, Select multi-selection mode, Button feedback API refactor, peer dependency relaxation - [RC 3](https://www.heroui.com/docs/native/releases/rc-3): TagGroup, Menu, and InputGroup components, Bottom Sheet Android back press fix, Expo 55 compatibility - [RC 4](https://www.heroui.com/docs/native/releases/rc-4): SubMenu component, Slider Output composition, PressableFeedback ripple fix, Bottom Sheet back handler fix - [v1.0.0](https://www.heroui.com/docs/native/releases/v1-0-0): LinkButton component, sub-menu conflict resolution, optional @gorhom/bottom-sheet, ThemeColorValue branded type - [v1.0.1](https://www.heroui.com/docs/native/releases/v1-0-1): Toast race condition fix, disabled state styling with disabled modifier, backdrop style variable - [v1.0.2](https://www.heroui.com/docs/native/releases/v1-0-2): asChild slot pattern for PressableFeedback and Surface, Portal accessibility modal prop, Button Android variant fix, Input and Select style refinements - [Button](https://www.heroui.com/docs/native/components/button): Interactive component that triggers an action when pressed. - [CloseButton](https://www.heroui.com/docs/native/components/close-button): Button component for closing dialogs, modals, or dismissing content. - [LinkButton](https://www.heroui.com/docs/native/components/link-button): A ghost-variant button with no highlight feedback, designed for inline link-style interactions. - [Menu](https://www.heroui.com/docs/native/components/menu): A floating context menu with positioning, selection groups, and multiple presentation modes. - [TagGroup](https://www.heroui.com/docs/native/components/tag-group): A compound component for displaying and managing selectable tags with optional removal. - [Slider](https://www.heroui.com/docs/native/components/slider): A draggable input for selecting a value or range within a bounded interval. - [Switch](https://www.heroui.com/docs/native/components/switch): A toggle control that allows users to switch between on and off states. - [Chip](https://www.heroui.com/docs/native/components/chip): Displays a compact element in a capsule shape. - [Alert](https://www.heroui.com/docs/native/components/alert): Displays important messages and notifications to users with status indicators. - [SkeletonGroup](https://www.heroui.com/docs/native/components/skeleton-group): Coordinates multiple skeleton loading placeholders with centralized animation control. - [Skeleton](https://www.heroui.com/docs/native/components/skeleton): Displays a loading placeholder with shimmer or pulse animation effects. - [Spinner](https://www.heroui.com/docs/native/components/spinner): Displays an animated loading indicator. - [Checkbox](https://www.heroui.com/docs/native/components/checkbox): A selectable control that allows users to toggle between checked and unchecked states. - [ControlField](https://www.heroui.com/docs/native/components/control-field): A field component that combines a label, description (or other content), and a control component (Switch or Checkbox) into a single pressable area. - [Description](https://www.heroui.com/docs/native/components/description): Text component for providing accessible descriptions and helper text for form fields and other UI elements. - [FieldError](https://www.heroui.com/docs/native/components/field-error): Displays validation error message content with smooth animations. - [InputGroup](https://www.heroui.com/docs/native/components/input-group): A compound layout component that groups an input with optional prefix and suffix decorators. - [InputOTP](https://www.heroui.com/docs/native/components/input-otp): Input component for entering one-time passwords (OTP) with individual character slots, animations, and validation support. - [Input](https://www.heroui.com/docs/native/components/input): A text input component with styled border and background for collecting user input. - [Label](https://www.heroui.com/docs/native/components/label): Text component for labeling form fields and other UI elements with support for required indicators and validation states. - [RadioGroup](https://www.heroui.com/docs/native/components/radio-group): A set of radio buttons where only one option can be selected at a time. - [SearchField](https://www.heroui.com/docs/native/components/search-field): A compound search input for filtering and querying content. - [Select](https://www.heroui.com/docs/native/components/select): Displays a list of options for the user to pick from — triggered by a button. - [TextArea](https://www.heroui.com/docs/native/components/text-area): A multiline text input component with styled border and background for collecting longer user input. - [TextField](https://www.heroui.com/docs/native/components/text-field): A text input component with label, description, and error handling for collecting user input. - [Card](https://www.heroui.com/docs/native/components/card): Displays a card container with flexible layout sections for structured content. - [Separator](https://www.heroui.com/docs/native/components/separator): A simple line to separate content visually. - [Surface](https://www.heroui.com/docs/native/components/surface): Container component that provides elevation and background styling. - [Avatar](https://www.heroui.com/docs/native/components/avatar): Displays a user avatar with support for images, text initials, or fallback icons. - [Accordion](https://www.heroui.com/docs/native/components/accordion): A collapsible content panel for organizing information in a compact space - [ListGroup](https://www.heroui.com/docs/native/components/list-group): A Surface-based container that groups related list items with consistent layout and spacing. - [Tabs](https://www.heroui.com/docs/native/components/tabs): Organize content into tabbed views with animated transitions and indicators. - [BottomSheet](https://www.heroui.com/docs/native/components/bottom-sheet): Displays a bottom sheet that slides up from the bottom with animated transitions and swipe-to-dismiss gestures. - [Dialog](https://www.heroui.com/docs/native/components/dialog): Displays a modal overlay with animated transitions and gesture-based dismissal. - [Popover](https://www.heroui.com/docs/native/components/popover): Displays a floating content panel anchored to a trigger element with placement and alignment options. - [Toast](https://www.heroui.com/docs/native/components/toast): Displays temporary notification messages that appear at the top or bottom of the screen. - [PressableFeedback](https://www.heroui.com/docs/native/components/pressable-feedback): Container component that provides visual feedback for press interactions with automatic scale animation. - [ScrollShadow](https://www.heroui.com/docs/native/components/scroll-shadow): Adds dynamic gradient shadows to scrollable content based on scroll position and overflow. - [Animation](https://www.heroui.com/docs/native/getting-started/animation): Add smooth animations and transitions to HeroUI Native components - [Colors](https://www.heroui.com/docs/native/getting-started/colors): Color palette and theming system for HeroUI Native - [Composition](https://www.heroui.com/docs/native/getting-started/composition): Build flexible UI with component composition patterns - [Portal](https://www.heroui.com/docs/native/getting-started/portal) - [Provider](https://www.heroui.com/docs/native/getting-started/provider): Configure HeroUI Native provider with text, animation, and toast settings - [Styling](https://www.heroui.com/docs/native/getting-started/styling): Style HeroUI Native components with Tailwind or StyleSheet API - [Theming](https://www.heroui.com/docs/native/getting-started/theming): Customize HeroUI Native's design system with CSS variables and global styles - [Design Principles](https://www.heroui.com/docs/native/getting-started/design-principles): Core principles that guide HeroUI v3's design and development - [Quick Start](https://www.heroui.com/docs/native/getting-started/quick-start): Get started with HeroUI Native in minutes - [Agent Skills](https://www.heroui.com/docs/native/getting-started/agent-skills): Enable AI assistants to build mobile UIs with HeroUI Native components - [AGENTS.md](https://www.heroui.com/docs/native/getting-started/agents-md): Download HeroUI Native documentation for AI coding agents - [LLMs.txt](https://www.heroui.com/docs/native/getting-started/llms-txt): Enable AI assistants like Claude, Cursor, and Windsurf to understand HeroUI Native - [MCP Server](https://www.heroui.com/docs/native/getting-started/mcp-server): Access HeroUI Native documentation directly in your AI assistant ~~~ ## llms-full Not found.