sh4dcnv2 · atlas
← libraries

@lumiui

Lumi UI is a composable React component library built on Base UI (MUI team's headless primitives) and Tailwind CSS, offering both pre-assembled composite components and raw primitive building blocks. Ships form and input components (Form, Input, Autocomplete, Combobox, OTP Field, Number Field, Select, Slider, Switch, Textarea), layout and navigation (Accordion, Tabs, Command Menu, Navigation Menu, Scroll Area, Sidebar), overlays (Dialog, Alert Dialog, Context Menu, Drawer, Dropdown Menu, Popover, Sheet, Tooltip), feedback (Meter, Progress, Toast), and display (Avatar, Chart, Resizable, Toolbar). Multiple built-in themes (Dune, Canopy, Celeste, Lagoon, Orchid). Use for: teams that prefer Base UI's accessibility model over Radix UI while still wanting Tailwind-styled, fully owned components.

60 components react shadcn-cli MIT

Install this registry

shadcn (npm) npx shadcn@latest add https://www.lumiui.dev/r/registry.json
pnpm pnpm dlx shadcn@latest add https://www.lumiui.dev/r/registry.json
bun bunx shadcn@latest add https://www.lumiui.dev/r/registry.json
fetch registry curl -s https://www.lumiui.dev/r/registry.json

Components

60 total
ui ui
npx shadcn@latest add https://www.lumiui.dev/r/ui.json
Chat Input ui

A chat input component.

npx shadcn@latest add https://www.lumiui.dev/r/chat-input.json
utils lib
npx shadcn@latest add https://www.lumiui.dev/r/utils.json
use-mobile hook
npx shadcn@latest add https://www.lumiui.dev/r/use-mobile.json
Accordion ui

A set of collapsible panels with headings.

npx shadcn@latest add https://www.lumiui.dev/r/accordion.json
Avatar ui

An easily stylable avatar component.

npx shadcn@latest add https://www.lumiui.dev/r/avatar.json
Alert Dialog ui

A dialog that requires user response to proceed.

npx shadcn@latest add https://www.lumiui.dev/r/alert-dialog.json
Dialog ui

A popup that opens on top of the entire page.

npx shadcn@latest add https://www.lumiui.dev/r/dialog.json
Drawer ui

A panel that slides in from the edge of the screen.

npx shadcn@latest add https://www.lumiui.dev/r/drawer.json
Tabs ui

A component for toggling between related panels on the same page.

npx shadcn@latest add https://www.lumiui.dev/r/tabs.json
Scroll Area ui

A native scroll container with custom scrollbars.

npx shadcn@latest add https://www.lumiui.dev/r/scroll-area.json
Popover ui

An accessible popup anchored to a button.

npx shadcn@latest add https://www.lumiui.dev/r/popover.json
Dropdown Menu ui

A list of actions in a dropdown, enhanced with keyboard navigation.

npx shadcn@latest add https://www.lumiui.dev/r/dropdown-menu.json
Autocomplete ui

An input that suggests options as you type.

npx shadcn@latest add https://www.lumiui.dev/r/autocomplete.json
Input ui

A native input element that automatically works with Field.

npx shadcn@latest add https://www.lumiui.dev/r/input.json
Button ui

A button component that can be rendered as another tag or focusable when disabled.

npx shadcn@latest add https://www.lumiui.dev/r/button.json
Checkbox ui

An easily stylable checkbox component.

npx shadcn@latest add https://www.lumiui.dev/r/checkbox.json
Switch ui

A control that indicates whether a setting is on or off.

npx shadcn@latest add https://www.lumiui.dev/r/switch.json
Select ui

A common form component for choosing a predefined value in a dropdown menu.

npx shadcn@latest add https://www.lumiui.dev/r/select.json
Navigation Menu ui

A collection of links and menus for website navigation.

npx shadcn@latest add https://www.lumiui.dev/r/navigation-menu.json
Collapsible ui

A collapsible panel controlled by a button.

npx shadcn@latest add https://www.lumiui.dev/r/collapsible.json
Command Menu ui

A mobile-friendly command palette for search and quick actions.

npx shadcn@latest add https://www.lumiui.dev/r/command-menu.json
Preview Card ui

An accessible popup anchored to a button.

npx shadcn@latest add https://www.lumiui.dev/r/preview-card.json
Progress ui

Displays the status of a task that takes a long time.

npx shadcn@latest add https://www.lumiui.dev/r/progress.json
Field ui

A component that provides labeling and validation for form controls.

npx shadcn@latest add https://www.lumiui.dev/r/field.json
Field Set ui

A native fieldset element with an easily stylable legend.

npx shadcn@latest add https://www.lumiui.dev/r/fieldset.json
Form ui

A native form element with consolidated error handling.

npx shadcn@latest add https://www.lumiui.dev/r/form.json
Radio ui

An easily stylable radio button component.

npx shadcn@latest add https://www.lumiui.dev/r/radio.json
Tooltip ui

A popup that appears when an element is hovered or focused, showing a hint for sighted users.

npx shadcn@latest add https://www.lumiui.dev/r/tooltip.json
Toggle ui

A two-state button that can be on or off.

npx shadcn@latest add https://www.lumiui.dev/r/toggle.json
Toggle Group ui

Provides a shared state to a series of toggle buttons.

npx shadcn@latest add https://www.lumiui.dev/r/toggle-group.json
Toast ui

Generates toast notifications.

npx shadcn@latest add https://www.lumiui.dev/r/toast.json
Checkbox Group ui

Provides a shared state to a series of checkboxes.

npx shadcn@latest add https://www.lumiui.dev/r/checkbox-group.json
Slider ui

An easily stylable range input.

npx shadcn@latest add https://www.lumiui.dev/r/slider.json
Separator ui

A separator element accessible to screen readers.

npx shadcn@latest add https://www.lumiui.dev/r/separator.json
Number Field ui

A numeric input element with increment and decrement buttons, and a scrub area.

npx shadcn@latest add https://www.lumiui.dev/r/number-field.json
Meter ui

A graphical display of a numeric value within a range.

npx shadcn@latest add https://www.lumiui.dev/r/meter.json
OTP Field ui

A one-time password input composed of individual character slots.

npx shadcn@latest add https://www.lumiui.dev/r/otp-field.json
Toolbar ui

A container for grouping a set of buttons and controls.

npx shadcn@latest add https://www.lumiui.dev/r/toolbar.json
Context Menu ui

A menu that appears at the pointer on right click or long press.

npx shadcn@latest add https://www.lumiui.dev/r/context-menu.json
Combobox ui

An input combined with a list of predefined items to select.

npx shadcn@latest add https://www.lumiui.dev/r/combobox.json
Menubar ui

A menu bar providing commands and options for your application.

npx shadcn@latest add https://www.lumiui.dev/r/menubar.json
Sheet ui

Extends the Dialog component to display content that complements the main content of the screen.

npx shadcn@latest add https://www.lumiui.dev/r/sheet.json
Resizable ui

Accessible resizable panel groups and layouts with keyboard support.

npx shadcn@latest add https://www.lumiui.dev/r/resizable.json
Arrow SVG ui

Arrow SVG component.

npx shadcn@latest add https://www.lumiui.dev/r/arrow-svg.json
Label ui

Renders an accessible label associated with controls.

npx shadcn@latest add https://www.lumiui.dev/r/label.json
Sidebar ui

App sidebar

npx shadcn@latest add https://www.lumiui.dev/r/sidebar.json
Textarea ui

A native textarea element.

npx shadcn@latest add https://www.lumiui.dev/r/textarea.json
Chart ui

Beautiful charts. Built using Recharts.

npx shadcn@latest add https://www.lumiui.dev/r/chart.json
Breadcrumb ui

Displays the path to the current resource using a hierarchy of links.

npx shadcn@latest add https://www.lumiui.dev/r/breadcrumb.json
Badge ui

Displays a small count or status indicator.

npx shadcn@latest add https://www.lumiui.dev/r/badge.json
Card ui

Displays content inside a themed container.

npx shadcn@latest add https://www.lumiui.dev/r/card.json
KBD ui

Styles keyboard key hints and key groups.

npx shadcn@latest add https://www.lumiui.dev/r/kbd.json
Skeleton ui

A placeholder used while content is loading.

npx shadcn@latest add https://www.lumiui.dev/r/skeleton.json
sidebar-01 block

Sidebar with collapsible icons and sections.

npx shadcn@latest add https://www.lumiui.dev/r/sidebar-01.json
sidebar-02 block

Dashboard layout with sidebar and main content area.

npx shadcn@latest add https://www.lumiui.dev/r/sidebar-02.json
dialog-01 block

Complex user management UI with nested dialogs.

npx shadcn@latest add https://www.lumiui.dev/r/dialog-01.json
dialog-02 block

Image gallery with nested auth dialogs. Inspired by Unsplash.

npx shadcn@latest add https://www.lumiui.dev/r/dialog-02.json
Project Status Picker component

A compact status selector optimized for efficiency. Features custom hotkey logic for instant selection, rich item rendering with status colors, and contextual …

npx shadcn@latest add https://www.lumiui.dev/r/project-status-picker.json
Expandable Dialog component

Responsive dialog that can expand and shrink

npx shadcn@latest add https://www.lumiui.dev/r/expandable-dialog.json