# madeui > Base UI + StyleX components you own. Agent-friendly by design. ## Changelog - [v0.1.0](https://madeui.com/changelog/v0-1-0) ## Docs - [Introduction](https://madeui.com/docs): Base UI + StyleX components you own. - [Installation](https://madeui.com/docs/installation): Set up the StyleX build and install your first components — Next.js and Vite. - [Customization](https://madeui.com/docs/customization): Theming with tokens, dark mode, per-instance overrides, and editing component source. - [Dark mode](https://madeui.com/docs/dark-mode): Apply the dark theme with StyleX createTheme — no flash, portals included. - [CLI](https://madeui.com/docs/cli): madeui init, add, and list — plus shadcn CLI compatibility. - [For AI agents](https://madeui.com/docs/agents): Why this library is easy for coding agents — and how to point yours at it. ### Components - [Accordion](https://madeui.com/docs/components/accordion): A vertically stacked set of interactive headings that each reveal a section of content. - [Alert](https://madeui.com/docs/components/alert): Displays a callout for user attention. - [Alert Dialog](https://madeui.com/docs/components/alert-dialog): A modal dialog that interrupts the user with important content and expects a response. - [Aspect Ratio](https://madeui.com/docs/components/aspect-ratio): Displays content within a desired ratio. - [Autocomplete](https://madeui.com/docs/components/autocomplete): Free-text input with a filtered suggestion popup. - [Avatar](https://madeui.com/docs/components/avatar): An image element with a fallback for representing the user. - [Badge](https://madeui.com/docs/components/badge): Displays a badge or a component that looks like a badge. - [Breadcrumb](https://madeui.com/docs/components/breadcrumb): Displays the path to the current resource using a hierarchy of links. - [Button](https://madeui.com/docs/components/button): Displays a button or a component that looks like a button. Built on Base UI, styled with StyleX. - [Button Group](https://madeui.com/docs/components/button-group): A container that groups related buttons into a segmented control. - [Card](https://madeui.com/docs/components/card): Displays a card with header, content, and footer. - [Checkbox](https://madeui.com/docs/components/checkbox): A control that allows the user to toggle between checked and not checked. - [Checkbox Group](https://madeui.com/docs/components/checkbox-group): Shares checked state across multiple checkboxes. - [Collapsible](https://madeui.com/docs/components/collapsible): An interactive component which expands and collapses a panel. - [Combobox](https://madeui.com/docs/components/combobox): Autocomplete input and command palette with a list of suggestions. - [Command](https://madeui.com/docs/components/command): Fast, composable command palette. - [Context Menu](https://madeui.com/docs/components/context-menu): Displays a menu at the pointer, triggered by a right click or a long press. - [Dialog](https://madeui.com/docs/components/dialog): A window overlaid on the page, rendering the content underneath inert. - [Drawer](https://madeui.com/docs/components/drawer): A swipeable panel that slides in from the edge of the screen. - [Dropdown Menu](https://madeui.com/docs/components/dropdown-menu): Displays a menu of actions — opened by a trigger button. - [Empty](https://madeui.com/docs/components/empty): Use the Empty component to display an empty state. - [Field](https://madeui.com/docs/components/field): Combine labels, controls, and help text to compose accessible form fields. - [Form](https://madeui.com/docs/components/form): Validated form built on Base UI Form and Field. - [Hover Card](https://madeui.com/docs/components/hover-card): For sighted users to preview content available behind a link. - [Input](https://madeui.com/docs/components/input): Displays a form input field. - [Input Group](https://madeui.com/docs/components/input-group): Display additional information or actions to an input or textarea. - [Input OTP](https://madeui.com/docs/components/input-otp): Accessible one-time password input with joined character slots. - [Item](https://madeui.com/docs/components/item): A flexible list row with media, content, and actions. - [Kbd](https://madeui.com/docs/components/kbd): Displays a keyboard key or shortcut hint. - [Label](https://madeui.com/docs/components/label): Renders an accessible label associated with controls. - [Menubar](https://madeui.com/docs/components/menubar): A visually persistent menu common in desktop applications that provides quick access to a consistent set of commands. - [Meter](https://madeui.com/docs/components/meter): A graduated gauge for a value within a known range. - [Navigation Menu](https://madeui.com/docs/components/navigation-menu): A collection of links for navigating websites, with animated popup panels. - [Number Field](https://madeui.com/docs/components/number-field): A numeric input with increment and decrement buttons. - [Pagination](https://madeui.com/docs/components/pagination): Pagination with page navigation, next and previous links. - [Popover](https://madeui.com/docs/components/popover): Displays rich content in a portal, triggered by a button. - [Progress](https://madeui.com/docs/components/progress): Displays an indicator showing the completion progress of a task. - [Radio Group](https://madeui.com/docs/components/radio-group): A set of checkable buttons where only one can be checked at a time. - [Scroll Area](https://madeui.com/docs/components/scroll-area): Augments native scroll functionality for custom, cross-browser styling. - [Select](https://madeui.com/docs/components/select): Displays a list of options for the user to pick from, triggered by a button. - [Separator](https://madeui.com/docs/components/separator): Visually or semantically separates content. - [Sheet](https://madeui.com/docs/components/sheet): Extends the Dialog component to display content that complements the main content of the screen. - [Skeleton](https://madeui.com/docs/components/skeleton): Use to show a placeholder while content is loading. - [Slider](https://madeui.com/docs/components/slider): An input where the user selects a value from within a given range. - [Spinner](https://madeui.com/docs/components/spinner): An indicator that shows something is loading. - [Switch](https://madeui.com/docs/components/switch): A control that allows the user to toggle between on and off. - [Table](https://madeui.com/docs/components/table): A responsive table component. - [Tabs](https://madeui.com/docs/components/tabs): A set of layered sections of content displayed one at a time. - [Textarea](https://madeui.com/docs/components/textarea): Displays a multi-line text input. - [Toast](https://madeui.com/docs/components/toast): A succinct message that is displayed temporarily. - [Toggle](https://madeui.com/docs/components/toggle): A two-state button that can be either on or off. - [Toggle Group](https://madeui.com/docs/components/toggle-group): A set of two-state buttons that can be toggled on or off. - [Toolbar](https://madeui.com/docs/components/toolbar): A container for grouping a set of buttons and controls. - [Tooltip](https://madeui.com/docs/components/tooltip): A popup that displays information related to an element on hover or focus. ## RSS Feeds - [madeui — Changelog](https://madeui.com/changelog/rss.xml)