View fulldotdev/ui on GitHub

Components

Browse installable Fulldev UI components for React.

AccordionA vertically stacked set of interactive headings that each reveal a section of content.AlertDisplays a callout for user attention.Alert DialogA modal dialog that interrupts the user with important content and expects a response.Aspect RatioDisplays content within a desired ratio.AttachmentDisplays a file or image attachment with media, metadata, upload state, and actions.AvatarAn image element with a fallback for representing the user.BadgeDisplays a badge or a component that looks like a badge.BannerA full-width container for important messages or announcements.BreadcrumbDisplays the path to the current resource using a hierarchy of links.BubbleDisplays conversational content in a message bubble. Supports variants, alignment, grouping, reactions, and collapsible content.ButtonDisplays a button or a component that looks like a button.Button GroupA container that groups related buttons together with consistent styling.CalendarA calendar component that allows users to select a date or a range of dates.CardDisplays a card with header, content, and footer.CarouselA carousel with motion and swipe built using Embla.ChartBeautiful charts. Built using Recharts. Copy and paste into your apps.CheckboxA control that allows the user to toggle between checked and not checked.CollapsibleAn interactive component which expands/collapses a panel.ComboboxAutocomplete input with a list of suggestions.CommandCommand menu for search and quick actions.Context MenuDisplays a menu of actions triggered by a right click.Data TablePowerful table and datagrids built using TanStack Table.Date PickerA date picker component with range and presets.DialogA window overlaid on either the primary window or another dialog window, rendering the content underneath inert.DirectionA provider component that sets the text direction for your application.DrawerA drawer component for React.Dropdown MenuDisplays a menu to the user, such as a set of actions or functions, triggered by a button.EmptyUse the Empty component to display an empty state.FieldCombine labels, controls, and help text to compose accessible form fields and grouped inputs.FormA form wrapper with vertical spacing for the field components.HeaderA responsive site header with grouped content.Hover CardFor sighted users to preview content available behind a link.IconRenders a Lucide icon or a social brand logo by name, or the icon for a link.InputA text input component for forms and user data entry with built-in styling and accessibility features.Input GroupAdd addons, buttons, and helper content to inputs.Input OTPAccessible one-time password component with copy-paste functionality.ItemA versatile component for displaying content with media, title, description, and actions.KbdUsed to display textual user input from keyboard.LabelRenders an accessible label associated with controls.LayoutPage-shell primitives for the root html, head, body, and main structure.LogoA component for displaying a brand logo.MarkerDisplays an inline status, system note, bordered row, or labeled separator in a conversation.MarqueeA continuously scrolling row of content, with a pause control and a static fallback.MenubarA visually persistent menu common in desktop applications that provides quick access to a consistent set of commands.MessageDisplays a message in a conversation, with optional avatar, header, footer, and alignment.Message ScrollerA chat scroll container that anchors turns, opens saved transcripts, follows streamed responses, loads history without jumping, and jumps to any message.Native SelectA styled native HTML select element with consistent design system integration.Navigation MenuA collection of links for navigating websites.PaginationPagination with page navigation, next and previous links.PopoverDisplays rich content in a portal, triggered by a button.PriceA flexible price display component for showing pricing information.ProgressDisplays an indicator showing the completion progress of a task, typically displayed as a progress bar.QuestionnaireA multi-step questionnaire with single-choice, multiple-choice, freeform, and skippable questions.Radio GroupA set of checkable buttons, known as radio buttons, where no more than one of the buttons can be checked at a time.RatingA star rating component for displaying ratings visually.ResizableAccessible resizable panel groups and layouts with keyboard support.Scroll AreaAugments native scroll functionality for custom, cross-browser styling.SectionA layout component for organizing page content into sections.SelectDisplays a list of options for the user to pick from, triggered by a button.SeparatorVisually or semantically separates content.SheetExtends the Dialog component to display content that complements the main content of the screen.SidebarA composable, themeable and customizable sidebar component.SkeletonUse to show a placeholder while content is loading.SliderAn input where the user selects a value from within a given range.SonnerToast notifications with Sonner, themed with the site tokens.SpinnerAn indicator that can be used to show a loading state.SwitchA control that allows the user to toggle between checked and not checked.TableA responsive table component.TabsA set of layered sections of content, known as tab panels, that are displayed one at a time.TextareaDisplays a form textarea or a component that looks like a textarea.Theme ToggleA two-state theme toggle that switches immediately between light and dark mode.ToastA succinct message that is displayed temporarily.TocDisplays a simple table of contents for page sections and subsections.ToggleA two-state button that can be either on or off.Toggle GroupA set of two-state buttons that can be toggled on or off.TooltipA popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it.TypographyAutomatic prose styling and semantic text primitives for documentation and content-heavy interfaces.VideoA responsive video component that supports YouTube videos and shorts.