---
name: "@hextaui"
slug: "hextaui"
description: "A shadcn/ui extension registry with 139 items spanning the full primitive set (Accordion through Tooltip, plus Button Group, Command Menu, Empty, Field, Input Group, Spinner, Video Player, Native Select, and Tree) and large suites of AI chat components (14: AI Chat History, Citations, File Upload, Model Selector, Streaming Response, Thinking, etc.), Auth flows (15: Login, Signup, OTP, Social, Magic Link, Recovery Codes), Billing blocks (14: Pricing Table, Invoice List, Payment Form, Subscription Card), Settings panels (17), Team views (12), and Task management blocks (7). Tailwind CSS, shadcn-compatible. Free. Use for: scaffolding complete SaaS application UI sections — especially auth, billing, team management, and AI chat — with production-quality blocks."
category: "Component library (general)"
tags: ["accessibility", "ai", "animation", "audio", "auth", "blocks", "buttons", "cards", "charts", "components", "dashboard", "forms", "hooks", "icons", "loaders", "media", "mobile", "navigation", "overlays", "payments", "pro-available", "saas", "tables", "theming"]
framework: "react"
license: "MIT"
author: "preetsuthar17"
website: "https://hextaui.com"
github: "https://github.com/preetsuthar17/hextaui"
registry: "https://hextaui.com/r/registry.json"
pro: true
pro_url: "https://hextaui.com/pricing"
github_stars: 143
component_count: 250
generated_at: "2026-10-27T06:34:08.542Z"
---

# @hextaui

A shadcn/ui extension registry with 139 items spanning the full primitive set (Accordion through Tooltip, plus Button Group, Command Menu, Empty, Field, Input Group, Spinner, Video Player, Native Select, and Tree) and large suites of AI chat components (14: AI Chat History, Citations, File Upload, Model Selector, Streaming Response, Thinking, etc.), Auth flows (15: Login, Signup, OTP, Social, Magic Link, Recovery Codes), Billing blocks (14: Pricing Table, Invoice List, Payment Form, Subscription Card), Settings panels (17), Team views (12), and Task management blocks (7). Tailwind CSS, shadcn-compatible. Free. Use for: scaffolding complete SaaS application UI sections — especially auth, billing, team management, and AI chat — with production-quality blocks.

## Links

- Website: https://hextaui.com
- GitHub: https://github.com/preetsuthar17/hextaui
- Registry JSON: https://hextaui.com/r/registry.json
- Directory page: https://sh4dcn.netlify.app/registry/hextaui
- This file: https://sh4dcn.netlify.app/md/hextaui.md
- Pro / pricing: https://hextaui.com/pricing

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://hextaui.com/r/registry.json
pnpm dlx shadcn@latest add https://hextaui.com/r/registry.json
bunx shadcn@latest add https://hextaui.com/r/registry.json
# clone the source repo
git clone https://github.com/preetsuthar17/hextaui.git
# fetch the raw registry index
curl -s https://hextaui.com/r/registry.json
```

## Components (250)

| name | type | description | install |
| --- | --- | --- | --- |
| theme | registry:theme | HextaUI design tokens: status colors, easing curves, hairline borders, type scale and the keyframes every component animates with. | `npx shadcn@latest add https://hextaui.com/r/theme.json` |
| hotkey | registry:lib | Parse, label, announce and match keyboard shortcuts, with ⌘ on Apple platforms and Ctrl everywhere else. | `npx shadcn@latest add https://hextaui.com/r/hotkey.json` |
| motion | registry:lib | The easing curves, durations and reduced-motion check every component animates with, plus hooks for size morphs and sliding highlights. | `npx shadcn@latest add https://hextaui.com/r/motion.json` |
| use-autosize | registry:hook | Grows a textarea with what you write between its minimum and maximum height, animating each change without ever touching the text. | `npx shadcn@latest add https://hextaui.com/r/use-autosize.json` |
| use-button-feedback | registry:hook | Runs an async action through loading, success and error, skipping the spinner for fast requests and holding an error while you read it. | `npx shadcn@latest add https://hextaui.com/r/use-button-feedback.json` |
| use-composed-ref | registry:hook | Keeps a ref to your own element while still forwarding it to whatever ref the parent passed in. | `npx shadcn@latest add https://hextaui.com/r/use-composed-ref.json` |
| use-delayed-loading | registry:hook | Shows a loading state only when work is actually slow, then keeps it up long enough that it never flickers. | `npx shadcn@latest add https://hextaui.com/r/use-delayed-loading.json` |
| use-held-keys | registry:hook | The keys someone is holding down right now, shared by every subscriber through a single set of window listeners. | `npx shadcn@latest add https://hextaui.com/r/use-held-keys.json` |
| use-invalid-shake | registry:hook | Shakes a form control when a submit attempt finds it invalid, and never while someone is still typing. | `npx shadcn@latest add https://hextaui.com/r/use-invalid-shake.json` |
| use-merged-ref | registry:hook | Combines any number of callback and object refs into one, with React 19 ref cleanup for each of them. | `npx shadcn@latest add https://hextaui.com/r/use-merged-ref.json` |
| use-pagination | registry:hook | Turns a page and a page count into the list of pages and ellipses to render, keeping its length steady as the page moves. | `npx shadcn@latest add https://hextaui.com/r/use-pagination.json` |
| use-today | registry:hook | Today's date that rolls over at midnight and when the tab comes back, without a hydration mismatch. | `npx shadcn@latest add https://hextaui.com/r/use-today.json` |
| accordion | registry:ui | Stacked headings that each reveal a panel, with height motion you can reverse mid-way and panels that stay searchable while closed. | `npx shadcn@latest add https://hextaui.com/r/accordion.json` |
| alert | registry:ui | Inline messages for status and feedback, with a neutral surface, a colored icon and a dismiss that collapses smoothly. | `npx shadcn@latest add https://hextaui.com/r/alert.json` |
| alert-dialog | registry:ui | A confirmation dialog for destructive or important actions that waits for async work, and becomes a bottom sheet on phones. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog.json` |
| aspect-ratio | registry:ui | A box that holds its shape before media loads, shimmers while loading, fades the media in and falls back when it fails. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio.json` |
| attachment | registry:ui | File and image cards for uploads, with progress, states, actions, a full-card trigger and names that keep their extension. | `npx shadcn@latest add https://hextaui.com/r/attachment.json` |
| avatar | registry:ui | User photos with an initials fallback, status badges and stacked groups that collapse into a count. | `npx shadcn@latest add https://hextaui.com/r/avatar.json` |
| badge | registry:ui | Status labels with colored dots, removable tags that slide closed and counts that roll to their new value. | `npx shadcn@latest add https://hextaui.com/r/badge.json` |
| breadcrumb | registry:ui | A trail of links to the current page that wraps safely, mirrors in right-to-left layouts and expands collapsed segments in place. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb.json` |
| bubble | registry:ui | Chat message bubbles with variants, grouped corners, reactions and room for interactive content. | `npx shadcn@latest add https://hextaui.com/r/bubble.json` |
| button | registry:ui | Buttons in every variant and size, with a built-in loading, success and error flow that skips the spinner for fast requests. | `npx shadcn@latest add https://hextaui.com/r/button.json` |
| button-group | registry:ui | Buttons joined into one control, with shared seams, separators, text addons, nesting and vertical stacks. | `npx shadcn@latest add https://hextaui.com/r/button-group.json` |
| calendar | registry:ui | A date grid for single, range and multiple selection, with sliding months, range previews and touch-sized days. | `npx shadcn@latest add https://hextaui.com/r/calendar.json` |
| card | registry:ui | A surface for grouping content, with three variants, edge-to-edge media, concentric radii and whole-card links. | `npx shadcn@latest add https://hextaui.com/r/card.json` |
| carousel | registry:ui | Native scroll-snap slides with momentum on touch, mouse dragging, arrow keys, dots, thumbnails and an autoplay that pauses when it should. | `npx shadcn@latest add https://hextaui.com/r/carousel.json` |
| chart | registry:ui | Recharts charts with themed colors, a tooltip and legend that read labels from one config, and keyboard navigation with a visible focus ring. | `npx shadcn@latest add https://hextaui.com/r/chart.json` |
| checkbox | registry:ui | A checkbox whose check draws in, with indeterminate parents, groups and labels that share its hover. | `npx shadcn@latest add https://hextaui.com/r/checkbox.json` |
| collapsible | registry:ui | A panel that shows and hides with height motion you can reverse mid-way, without jumping the layout. | `npx shadcn@latest add https://hextaui.com/r/collapsible.json` |
| combobox | registry:ui | A filterable select with chips, groups and async results, in a popup that resizes as you type. | `npx shadcn@latest add https://hextaui.com/r/combobox.json` |
| command | registry:ui | A searchable list of actions, inline or as a ⌘K palette, with pages, shortcuts and highlighted matches. | `npx shadcn@latest add https://hextaui.com/r/command.json` |
| context-menu | registry:ui | A menu of actions on right click or long press, with submenus, checkbox and radio items, and hold feedback on touch. | `npx shadcn@latest add https://hextaui.com/r/context-menu.json` |
| data-table | registry:ui | A table for real data, with sorting, search, row selection, pinned columns, a sticky header and pagination. | `npx shadcn@latest add https://hextaui.com/r/data-table.json` |
| date-picker | registry:ui | A button that opens a calendar in a popover, or a bottom sheet on phones, for single dates and ranges. | `npx shadcn@latest add https://hextaui.com/r/date-picker.json` |
| dialog | registry:ui | A window over the page for forms and focused tasks, with a pinned header and footer, nesting, and a swipeable bottom sheet on phones. | `npx shadcn@latest add https://hextaui.com/r/dialog.json` |
| drawer | registry:ui | A panel that slides in from any edge and follows your finger, with snap points, a working handle and nested drawers that stack. | `npx shadcn@latest add https://hextaui.com/r/drawer.json` |
| dropdown-menu | registry:ui | A menu of actions and options behind a button, with groups, submenus, checkbox and radio items, and shortcuts. | `npx shadcn@latest add https://hextaui.com/r/dropdown-menu.json` |
| empty | registry:ui | A placeholder for screens with nothing to show yet, with an icon, a message and the next action. | `npx shadcn@latest add https://hextaui.com/r/empty.json` |
| field | registry:ui | Labels, descriptions and errors wired to their control, with validation states and layouts for forms. | `npx shadcn@latest add https://hextaui.com/r/field.json` |
| hover-card | registry:ui | A preview card that opens when a link is hovered or focused, for content sighted users can glance at. | `npx shadcn@latest add https://hextaui.com/r/hover-card.json` |
| input | registry:ui | A text input with three sizes, invalid and read-only states, native validation styling and a 16px touch font so phones never zoom in. | `npx shadcn@latest add https://hextaui.com/r/input.json` |
| input-group | registry:ui | An input with icons, text, buttons or a keyboard hint attached, sharing one border and focus ring. | `npx shadcn@latest add https://hextaui.com/r/input-group.json` |
| input-otp | registry:ui | One-time code slots that take typing, paste and SMS autofill, with an opt-in animation that cascades codes in and a status for verifying. | `npx shadcn@latest add https://hextaui.com/r/input-otp.json` |
| item | registry:ui | A row of media, text and actions for lists, settings and pickers, with a grouped surface and a hover highlight that glides between rows. | `npx shadcn@latest add https://hextaui.com/r/item.json` |
| kbd | registry:ui | Key caps for shortcuts that show the right symbols on every platform, read them out properly and press down with the real keys. | `npx shadcn@latest add https://hextaui.com/r/kbd.json` |
| label | registry:ui | A label that follows its control, dimming when it's disabled and marking it required or optional on its own. | `npx shadcn@latest add https://hextaui.com/r/label.json` |
| marker | registry:ui | Quiet notes between content, like date dividers and system events, with sticky dates and times that read as Today or Yesterday. | `npx shadcn@latest add https://hextaui.com/r/marker.json` |
| menubar | registry:ui | A desktop-style bar of menus with one highlight that slides between open menus and instant switching as you sweep across. | `npx shadcn@latest add https://hextaui.com/r/menubar.json` |
| message | registry:ui | A chat message row with an avatar, name, bubbles and status, where new messages rise in from the sender's side. | `npx shadcn@latest add https://hextaui.com/r/message.json` |
| message-scroller | registry:ui | A chat scroll area that follows new messages, keeps your place while you read back, and counts what you missed on the jump button. | `npx shadcn@latest add https://hextaui.com/r/message-scroller.json` |
| native-select | registry:ui | The browser's own select, styled to match Input, with a quiet placeholder, Field support and the OS picker on every device. | `npx shadcn@latest add https://hextaui.com/r/native-select.json` |
| navigation-menu | registry:ui | Site navigation with dropdowns, or one full-width panel that stays open while its content slides between menus. | `npx shadcn@latest add https://hextaui.com/r/navigation-menu.json` |
| number-flow | registry:ui | Animated numbers where only the changed digits spin, with any Intl format and locale. | `npx shadcn@latest add https://hextaui.com/r/number-flow.json` |
| pagination | registry:ui | Page navigation that keeps every button in place, glides to the current page and jumps to any page from the ellipsis. | `npx shadcn@latest add https://hextaui.com/r/pagination.json` |
| popover | registry:ui | A floating panel anchored to a trigger that resizes smoothly with its content and follows the trigger’s direction. | `npx shadcn@latest add https://hextaui.com/r/popover.json` |
| progress | registry:ui | A bar or ring that shows how far a task has come, eases between updates and slides while the total is unknown. | `npx shadcn@latest add https://hextaui.com/r/progress.json` |
| questionnaire | registry:ui | A step-by-step form that moves between questions with a sense of direction, shows real progress and answers from the keyboard. | `npx shadcn@latest add https://hextaui.com/r/questionnaire.json` |
| radio-group | registry:ui | Pick one option from a set, with a dot that hands off between choices and cards whose selection ring slides to the new pick. | `npx shadcn@latest add https://hextaui.com/r/radio-group.json` |
| resizable | registry:ui | Panels you can drag apart, with a quiet divider that wakes up on hover, sizes that glide on reset or collapse, and layouts that persist. | `npx shadcn@latest add https://hextaui.com/r/resizable.json` |
| safe-area | registry:ui | A pointer safe triangle that keeps submenus and flyouts open while the cursor travels diagonally toward them. | `npx shadcn@latest add https://hextaui.com/r/safe-area.json` |
| scroll-area | registry:ui | Native scrolling with a minimal scrollbar, edges that fade only where there’s more to see, and an optional peek that cuts the last item in half. | `npx shadcn@latest add https://hextaui.com/r/scroll-area.json` |
| select | registry:ui | Pick one or more options from a list that opens on the current value, with typeahead, groups and form support. | `npx shadcn@latest add https://hextaui.com/r/select.json` |
| separator | registry:ui | A hairline that divides content horizontally or vertically, with an optional label and a decorative mode for purely visual lines. | `npx shadcn@latest add https://hextaui.com/r/separator.json` |
| sheet | registry:ui | A panel that slides in from any edge, with swipe-to-dismiss, scroll lock and stacked nesting. | `npx shadcn@latest add https://hextaui.com/r/sheet.json` |
| sidebar | registry:ui | An app sidebar that collapses to icons or off canvas, stays pinned under your header, and becomes a swipeable sheet on phones. | `npx shadcn@latest add https://hextaui.com/r/sidebar.json` |
| skeleton | registry:ui | Placeholders that wait 150ms before showing, take the exact size of the content they wrap, and fade it in without moving anything. | `npx shadcn@latest add https://hextaui.com/r/skeleton.json` |
| slider | registry:ui | Pick a value or a range by dragging, tapping the track or using the keys, with jumps that glide and an optional value bubble. | `npx shadcn@latest add https://hextaui.com/r/slider.json` |
| spinner | registry:ui | A loading indicator with Apple-style ticks or a breathing ring that can wait before showing and stay long enough not to flicker. | `npx shadcn@latest add https://hextaui.com/r/spinner.json` |
| switch | registry:ui | An on/off toggle you can tap, press or drag, with a thumb that stretches under your finger and an optional pending state for saves. | `npx shadcn@latest add https://hextaui.com/r/switch.json` |
| table | registry:ui | A responsive table with a surface style, wrapping or compact cells, sticky headers, pinned columns and scroll hints. | `npx shadcn@latest add https://hextaui.com/r/table.json` |
| tabs | registry:ui | Switch between views with an indicator that slides to the active tab, as a segmented control or an underline, and lists that scroll when they overflow. | `npx shadcn@latest add https://hextaui.com/r/tabs.json` |
| textarea | registry:ui | Multi-line text that grows smoothly with what you write between a minimum and maximum number of rows, with counters, validation and a submit shortcut. | `npx shadcn@latest add https://hextaui.com/r/textarea.json` |
| toast | registry:ui | Brief messages that stack neatly, expand on hover, swipe away, and turn a loading state into success or error in place. | `npx shadcn@latest add https://hextaui.com/r/toast.json` |
| toggle | registry:ui | A button that stays on or off, with a fill that settles in when pressed, a clear hover-to-on step and icons that can fill with the state. | `npx shadcn@latest add https://hextaui.com/r/toggle.json` |
| toggle-group | registry:ui | A row of toggles for one choice or many, with a fill that slides to the picked item, joined or spaced items and arrow-key focus. | `npx shadcn@latest add https://hextaui.com/r/toggle-group.json` |
| tooltip | registry:ui | A short hint on hover or keyboard focus that opens after a brief rest, switches instantly between neighbours and shows shortcuts. | `npx shadcn@latest add https://hextaui.com/r/tooltip.json` |
| tree | registry:ui | Nested, expandable rows for files and hierarchies, with indent guides, connector lines, cascading checkboxes, typeahead and full keyboard support. | `npx shadcn@latest add https://hextaui.com/r/tree.json` |
| video-player | registry:ui | A video player with a scrubbable seek bar, auto-hiding controls, keyboard shortcuts, speed, picture in picture and full screen. | `npx shadcn@latest add https://hextaui.com/r/video-player.json` |
| all | registry:item | Every HextaUI component, the theme, shared libs and hooks in one install. | `npx shadcn@latest add https://hextaui.com/r/all.json` |
| accordion-controlled | registry:example | The Controlled example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-controlled.json` |
| accordion-custom-icon | registry:example | The Custom icon example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-custom-icon.json` |
| accordion-demo | registry:example | The main Accordion demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-demo.json` |
| accordion-disabled | registry:example | The Disabled example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-disabled.json` |
| accordion-ghost | registry:example | The Ghost example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-ghost.json` |
| accordion-leading-icons | registry:example | The Leading icons example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-leading-icons.json` |
| accordion-long-content | registry:example | The Long content example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-long-content.json` |
| accordion-multiple | registry:example | The Multiple example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-multiple.json` |
| accordion-nested | registry:example | The Nested example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-nested.json` |
| accordion-outline | registry:example | The Outline example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-outline.json` |
| accordion-rtl | registry:example | The Right to left example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-rtl.json` |
| accordion-separated | registry:example | The Separated example from the Accordion docs. | `npx shadcn@latest add https://hextaui.com/r/accordion-separated.json` |
| alert-actions | registry:example | The Actions example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-actions.json` |
| alert-cancel-dismiss | registry:example | The Cancel a dismiss example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-cancel-dismiss.json` |
| alert-controlled | registry:example | The Controlled example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-controlled.json` |
| alert-demo | registry:example | The main Alert demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/alert-demo.json` |
| alert-dismissible | registry:example | The Dismissible example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dismissible.json` |
| alert-inserted | registry:example | The Inserted after load example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-inserted.json` |
| alert-partial-content | registry:example | The Partial content example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-partial-content.json` |
| alert-rich-content | registry:example | The Rich content example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-rich-content.json` |
| alert-rtl | registry:example | The Right to left example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-rtl.json` |
| alert-soft | registry:example | The Soft example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-soft.json` |
| alert-variants | registry:example | The Variants example from the Alert docs. | `npx shadcn@latest add https://hextaui.com/r/alert-variants.json` |
| alert-dialog-async-action | registry:example | The Async action example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-async-action.json` |
| alert-dialog-controlled | registry:example | The Controlled example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-controlled.json` |
| alert-dialog-demo | registry:example | The main Alert dialog demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-demo.json` |
| alert-dialog-detached-triggers | registry:example | The Detached triggers example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-detached-triggers.json` |
| alert-dialog-long-content | registry:example | The Long content example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-long-content.json` |
| alert-dialog-media | registry:example | The Media example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-media.json` |
| alert-dialog-nested | registry:example | The Nested example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-nested.json` |
| alert-dialog-rtl | registry:example | The Right to left example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-rtl.json` |
| alert-dialog-small | registry:example | The Small example from the Alert dialog docs. | `npx shadcn@latest add https://hextaui.com/r/alert-dialog-small.json` |
| aspect-ratio-broken-image | registry:example | The Broken image example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-broken-image.json` |
| aspect-ratio-demo | registry:example | The main Aspect ratio demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-demo.json` |
| aspect-ratio-figure | registry:example | The As a figure example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-figure.json` |
| aspect-ratio-flex-column | registry:example | The Inside a centered flex column example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-flex-column.json` |
| aspect-ratio-invalid-ratio | registry:example | The Invalid ratio example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-invalid-ratio.json` |
| aspect-ratio-overlay | registry:example | The Overlay example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-overlay.json` |
| aspect-ratio-ratios | registry:example | The Ratios example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-ratios.json` |
| aspect-ratio-responsive | registry:example | The Responsive example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-responsive.json` |
| aspect-ratio-rtl | registry:example | The Right to left example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-rtl.json` |
| aspect-ratio-slow-load | registry:example | The Slow load example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-slow-load.json` |
| aspect-ratio-text-content | registry:example | The Text content example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-text-content.json` |
| aspect-ratio-without-placeholder | registry:example | The Without placeholder example from the Aspect ratio docs. | `npx shadcn@latest add https://hextaui.com/r/aspect-ratio-without-placeholder.json` |
| attachment-broken-image | registry:example | The Broken image example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-broken-image.json` |
| attachment-composer | registry:example | The Composer example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-composer.json` |
| attachment-demo | registry:example | The main Attachment demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-demo.json` |
| attachment-group | registry:example | The Group example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-group.json` |
| attachment-image | registry:example | The Image example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-image.json` |
| attachment-long-names | registry:example | The Long names example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-long-names.json` |
| attachment-rtl | registry:example | The Right to left example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-rtl.json` |
| attachment-sizes | registry:example | The Sizes example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-sizes.json` |
| attachment-states | registry:example | The States example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-states.json` |
| attachment-stress | registry:example | The Stress example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-stress.json` |
| attachment-trigger | registry:example | The Trigger example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-trigger.json` |
| attachment-upload-flow | registry:example | The Upload flow example from the Attachment docs. | `npx shadcn@latest add https://hextaui.com/r/attachment-upload-flow.json` |
| avatar-demo | registry:example | The main Avatar demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-demo.json` |
| avatar-group | registry:example | The Group example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-group.json` |
| avatar-initials | registry:example | The Initials example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-initials.json` |
| avatar-layout | registry:example | The Layout example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-layout.json` |
| avatar-linked-group | registry:example | The Linked group example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-linked-group.json` |
| avatar-loading | registry:example | The Loading example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-loading.json` |
| avatar-rtl | registry:example | The Right to left example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-rtl.json` |
| avatar-sizes | registry:example | The Sizes and shapes example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-sizes.json` |
| avatar-status | registry:example | The Status example from the Avatar docs. | `npx shadcn@latest add https://hextaui.com/r/avatar-status.json` |
| badge-controlled | registry:example | The Controlled example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-controlled.json` |
| badge-counts | registry:example | The Counts example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-counts.json` |
| badge-demo | registry:example | The main Badge demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/badge-demo.json` |
| badge-interactive | registry:example | The Interactive example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-interactive.json` |
| badge-long-content | registry:example | The Long content example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-long-content.json` |
| badge-removable | registry:example | The Removable example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-removable.json` |
| badge-rtl | registry:example | The Right to left example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-rtl.json` |
| badge-sizes | registry:example | The Sizes example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-sizes.json` |
| badge-variants | registry:example | The Variants and appearances example from the Badge docs. | `npx shadcn@latest add https://hextaui.com/r/badge-variants.json` |
| breadcrumb-basic | registry:example | The Basic example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-basic.json` |
| breadcrumb-controlled | registry:example | The Collapsed example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-controlled.json` |
| breadcrumb-custom-separator | registry:example | The Custom separator example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-custom-separator.json` |
| breadcrumb-demo | registry:example | The main Breadcrumb demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-demo.json` |
| breadcrumb-dropdown | registry:example | The Dropdown example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-dropdown.json` |
| breadcrumb-ellipsis | registry:example | The Ellipsis example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-ellipsis.json` |
| breadcrumb-link-component | registry:example | The Link component example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-link-component.json` |
| breadcrumb-long-content | registry:example | The Long content example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-long-content.json` |
| breadcrumb-rtl | registry:example | The Right to left example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-rtl.json` |
| breadcrumb-with-icons | registry:example | The With icons example from the Breadcrumb docs. | `npx shadcn@latest add https://hextaui.com/r/breadcrumb-with-icons.json` |
| bubble-alignment | registry:example | The Alignment example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-alignment.json` |
| bubble-demo | registry:example | The main Bubble demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-demo.json` |
| bubble-group | registry:example | The Group example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-group.json` |
| bubble-long-content | registry:example | The Long content example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-long-content.json` |
| bubble-nested | registry:example | The Nested reply example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-nested.json` |
| bubble-popover | registry:example | The Popover example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-popover.json` |
| bubble-reactions | registry:example | The Reactions example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-reactions.json` |
| bubble-rtl | registry:example | The Right to left example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-rtl.json` |
| bubble-shapes | registry:example | The Shapes example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-shapes.json` |
| bubble-show-more | registry:example | The Show more example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-show-more.json` |
| bubble-tail | registry:example | The Tail example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-tail.json` |
| bubble-tooltip | registry:example | The Tooltip example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-tooltip.json` |
| bubble-variants | registry:example | The Variants example from the Bubble docs. | `npx shadcn@latest add https://hextaui.com/r/bubble-variants.json` |
| button-controlled-loading | registry:example | The Controlled loading example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-controlled-loading.json` |
| button-controlled-status | registry:example | The Controlled status example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-controlled-status.json` |
| button-custom-labels | registry:example | The Custom labels example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-custom-labels.json` |
| button-demo | registry:example | The main Button demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/button-demo.json` |
| button-disabled | registry:example | The Disabled example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-disabled.json` |
| button-error-details | registry:example | The Error details example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-error-details.json` |
| button-form | registry:example | The Forms example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-form.json` |
| button-icon-feedback | registry:example | The Icon buttons example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-icon-feedback.json` |
| button-link | registry:example | The As a link example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-link.json` |
| button-pill | registry:example | The Pill example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-pill.json` |
| button-rtl | registry:example | The Right to left example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-rtl.json` |
| button-sizes | registry:example | The Sizes example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-sizes.json` |
| button-smooth-width | registry:example | The Smooth width example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-smooth-width.json` |
| button-variants-feedback | registry:example | The Feedback on every variant example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-variants-feedback.json` |
| button-variants | registry:example | The Variants example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-variants.json` |
| button-with-icon | registry:example | The With icon example from the Button docs. | `npx shadcn@latest add https://hextaui.com/r/button-with-icon.json` |
| button-group-demo | registry:example | The main Button group demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-demo.json` |
| button-group-disabled | registry:example | The Disabled and invalid example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-disabled.json` |
| button-group-feedback | registry:example | The Feedback inside a group example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-feedback.json` |
| button-group-fieldset | registry:example | The As a fieldset example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-fieldset.json` |
| button-group-full-width | registry:example | The Full width example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-full-width.json` |
| button-group-input | registry:example | The With text and an input example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-input.json` |
| button-group-nested | registry:example | The Nested groups example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-nested.json` |
| button-group-player | registry:example | The Separators example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-player.json` |
| button-group-rtl | registry:example | The Right to left example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-rtl.json` |
| button-group-sizes | registry:example | The Sizes example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-sizes.json` |
| button-group-split | registry:example | The Split button example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-split.json` |
| button-group-vertical | registry:example | The Vertical example from the Button group docs. | `npx shadcn@latest add https://hextaui.com/r/button-group-vertical.json` |
| calendar-bounded | registry:example | The Bounded example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-bounded.json` |
| calendar-controlled | registry:example | The Controlled month example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-controlled.json` |
| calendar-demo | registry:example | The main Calendar demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-demo.json` |
| calendar-dropdowns | registry:example | The Month and year dropdowns example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-dropdowns.json` |
| calendar-fixed-today | registry:example | The Fixed today example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-fixed-today.json` |
| calendar-multiple | registry:example | The Multiple example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-multiple.json` |
| calendar-range-limits | registry:example | The Range limits example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-range-limits.json` |
| calendar-range | registry:example | The Range example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-range.json` |
| calendar-rtl | registry:example | The Right to left example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-rtl.json` |
| calendar-sheet | registry:example | The Inside a sheet example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-sheet.json` |
| calendar-week-numbers | registry:example | The Week numbers example from the Calendar docs. | `npx shadcn@latest add https://hextaui.com/r/calendar-week-numbers.json` |
| card-borders | registry:example | The Borders example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-borders.json` |
| card-demo | registry:example | The main Card demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/card-demo.json` |
| card-link-variants | registry:example | The Clickable variants example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-link-variants.json` |
| card-link | registry:example | The Clickable card example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-link.json` |
| card-long-content | registry:example | The Long content example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-long-content.json` |
| card-media | registry:example | The Media example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-media.json` |
| card-nested | registry:example | The Nested example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-nested.json` |
| card-rtl | registry:example | The Right to left example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-rtl.json` |
| card-semantics | registry:example | The Semantics example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-semantics.json` |
| card-sizes | registry:example | The Sizes example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-sizes.json` |
| card-variants | registry:example | The Variants example from the Card docs. | `npx shadcn@latest add https://hextaui.com/r/card-variants.json` |
| carousel-api | registry:example | The API example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-api.json` |
| carousel-autoplay | registry:example | The Autoplay example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-autoplay.json` |
| carousel-controlled | registry:example | The Controlled example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-controlled.json` |
| carousel-demo | registry:example | The main Carousel demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-demo.json` |
| carousel-dots-and-counter | registry:example | The Dots and counter example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-dots-and-counter.json` |
| carousel-dynamic | registry:example | The Adding and removing slides example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-dynamic.json` |
| carousel-links | registry:example | The Links and focusable content example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-links.json` |
| carousel-long-content | registry:example | The Long content and a single slide example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-long-content.json` |
| carousel-nested | registry:example | The Nested example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-nested.json` |
| carousel-rewind | registry:example | The Rewind and start index example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-rewind.json` |
| carousel-rtl | registry:example | The Right to left example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-rtl.json` |
| carousel-several-per-view | registry:example | The Several per view example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-several-per-view.json` |
| carousel-thumbnails | registry:example | The Thumbnails example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-thumbnails.json` |
| carousel-vertical | registry:example | The Vertical example from the Carousel docs. | `npx shadcn@latest add https://hextaui.com/r/carousel-vertical.json` |
| chart-bar | registry:example | The Bar chart example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-bar.json` |
| chart-demo | registry:example | The main Chart demo from the docs. | `npx shadcn@latest add https://hextaui.com/r/chart-demo.json` |
| chart-horizontal | registry:example | The Horizontal bars example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-horizontal.json` |
| chart-icons | registry:example | The Icons example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-icons.json` |
| chart-line | registry:example | The Line chart example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-line.json` |
| chart-long-labels | registry:example | The Long labels example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-long-labels.json` |
| chart-negative | registry:example | The Negative values example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-negative.json` |
| chart-pie | registry:example | The Donut example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-pie.json` |
| chart-radar | registry:example | The Radar example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-radar.json` |
| chart-rtl | registry:example | The Right to left example from the Chart docs. | `npx shadcn@latest add https://hextaui.com/r/chart-rtl.json` |

## For AI agents

```text
You are adding components from @hextaui to a shadcn-compatible project.
1. Read this file (https://sh4dcn.netlify.app/md/hextaui.md) for the component list.
2. Fetch the machine-readable index: https://hextaui.com/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.netlify.app/json (library slug: hextaui).
```