ActiveIcons/logos106
@uiable
Icons/logos · MIT · data updated 2026-09-05
Free, open-source UI component library built with Next.js, React 19, Tailwind CSS v4, and shadcn/ui — beautifully designed components you can copy, customize, and make your own.
backgroundsblockscardsdashboarddesign-systemiconsloadersmedianavigationoverlays
Install
npx shadcn@latest add https://uiable.com/r/registry.jsonHealth
StatusActive
Last commit3 days ago
LicenseMIT
Open issues0
ArchivedNo
Stars106
Components (810)
accordion-active-bgaccordion-basicaccordion-bordersaccordion-cardaccordion-disabledaccordion-flushaccordion-iconsaccordion-multiplealert-actionalert-basicalert-border-left-dangeralert-border-left-darkalert-colorsalert-destructivealert-dialog-basicalert-dialog-destructivealert-dialog-lockalert-dialog-mediaalert-dialog-smallalert-dialog-small-mediaalert-dialog-warningalert-dismissible-dangeralert-dismissible-darkalert-dismissible-infoalert-dismissible-primaryalert-dismissible-secondaryalert-dismissible-successalert-dismissible-warningalert-icon-dangeralert-icon-darkalert-icon-infoalert-icon-primaryalert-icon-secondaryalert-icon-successalert-icon-warningalert-light-dangeralert-light-darkalert-light-infoalert-light-primaryalert-light-secondaryalert-light-successalert-light-warningalert-outlined-dangeralert-outlined-darkalert-outlined-infoalert-outlined-primaryalert-outlined-secondaryalert-outlined-successalert-outlined-warningalert-solid-dangeralert-solid-darkalert-solid-infoalert-solid-primaryalert-solid-secondaryalert-solid-successalert-solid-warningaspect-ratio-cinematicaspect-ratio-portraitaspect-ratio-squareaspect-ratio-standard
Components: accordion-active-bg, accordion-basic, accordion-borders, accordion-card, accordion-disabled, accordion-flush, accordion-icons, accordion-multiple, alert-action, alert-basic, alert-border-left-danger, alert-border-left-dark, alert-colors, alert-destructive, alert-dialog-basic, alert-dialog-destructive, alert-dialog-lock, alert-dialog-media, alert-dialog-small, alert-dialog-small-media, alert-dialog-warning, alert-dismissible-danger, alert-dismissible-dark, alert-dismissible-info, alert-dismissible-primary, alert-dismissible-secondary, alert-dismissible-success, alert-dismissible-warning, alert-icon-danger, alert-icon-dark, alert-icon-info, alert-icon-primary, alert-icon-secondary, alert-icon-success, alert-icon-warning, alert-light-danger, alert-light-dark, alert-light-info, alert-light-primary, alert-light-secondary, alert-light-success, alert-light-warning, alert-outlined-danger, alert-outlined-dark, alert-outlined-info, alert-outlined-primary, alert-outlined-secondary, alert-outlined-success, alert-outlined-warning, alert-solid-danger, alert-solid-dark, alert-solid-info, alert-solid-primary, alert-solid-secondary, alert-solid-success, alert-solid-warning, aspect-ratio-cinematic, aspect-ratio-portrait, aspect-ratio-square, aspect-ratio-standard, attachment-group, attachment-sizes, attachment-states, attachment-triggers, attachment-vertical, avatar-badge, avatar-badge-icon, avatar-basic, avatar-border-radius, avatar-counter-indicator, avatar-dropdown, avatar-fallback, avatar-group, avatar-group-count, avatar-group-count-icon, avatar-placeholder-icon, avatar-size, badge-avatar, badge-colors, badge-gradient, badge-icon, badge-light-danger, badge-light-dark, badge-light-info, badge-light-primary, badge-light-secondary, badge-light-success, badge-light-warning, badge-link, badge-outline-danger, badge-outline-dark, badge-outline-info, badge-outline-primary, badge-outline-secondary, badge-outline-success, badge-outline-warning, badge-pill-danger, badge-pill-dark, badge-pill-info, badge-pill-primary, badge-pill-secondary, badge-pill-success, badge-pill-warning, badge-sizes, badge-solid-danger, badge-solid-dark, badge-solid-info, badge-solid-primary, badge-solid-secondary, badge-solid-success, badge-solid-warning, badge-spinner, badge-status, block-list, block-sidebar, breadcrumb-background, breadcrumb-basic, breadcrumb-collapsed, breadcrumb-dropdown, breadcrumb-ellipsis, breadcrumb-icon, breadcrumb-link, breadcrumb-outline, breadcrumb-page-header, breadcrumb-separator, breadcrumb-stepper, bubble-alignment, bubble-collapsible, bubble-group, bubble-link, bubble-popover, bubble-reactions, bubble-tooltip, bubble-variants, button-animated, button-animated-border, button-animated-gradient, button-default, button-destructive, button-ghost, button-group-dropdown, button-group-icon, button-group-input, button-group-input-group, button-group-nested, button-group-orientation, button-group-popover, button-group-qty-select, button-group-select, button-group-separator, button-group-size, button-group-social, button-group-split, button-group-toolbar, button-icon, button-icon-danger, button-icon-dark, button-icon-info, button-icon-primary, button-icon-secondary, button-icon-success, button-icon-warning, button-light-danger, button-light-dark, button-light-info, button-light-primary, button-light-secondary, button-light-success, button-light-warning, button-link, button-outline, button-outline-danger, button-outline-dark, button-outline-info, button-outline-primary, button-outline-secondary, button-outline-success, button-outline-warning, button-render, button-rounded, button-secondary, button-size, button-social, button-solid-danger, button-solid-dark, button-solid-info, button-solid-primary, button-solid-secondary, button-solid-success, button-solid-warning, button-spinner, button-toggle, button-with-badge, button-with-icon, calendar-basic, calendar-booked-dates, calendar-caption, calendar-custom-days, calendar-hijri, calendar-multiple, calendar-presets, calendar-range, calendar-right-navigation, calendar-time, calendar-week-numbers, card-align-center, card-align-right, card-animated-flip, card-animated-tilt, card-basic, card-header-footer, card-horizontal, card-image, card-image-bottom, card-image-overlay, card-image-top, card-product, card-small, card-solid-danger, card-solid-dark, card-solid-info, card-solid-primary, card-solid-secondary, card-solid-success, card-solid-warning, card-tabs, card-title-subtitle, carousel-api, carousel-multiple, carousel-orientation, carousel-plugin, carousel-size, carousel-spacing, changelog-entry, changelog-mobile-toc, changelog-toc, chart-area, chart-example, chart-example-axis, chart-example-grid, chart-example-legend, chart-example-tooltip, chart-line, chart-pie, chart-radial, chart-tooltip, checkbox-basic, checkbox-colors, checkbox-description, checkbox-disabled, checkbox-group, checkbox-indeterminate, checkbox-invalid, checkbox-list, checkbox-size, checkbox-table, checkbox-todo-list, collapsible-basic, collapsible-file-tree, collapsible-settings, combobox-auto-highlight, combobox-autocomplete, combobox-basic, combobox-clear, combobox-custom, combobox-disabled, combobox-error, combobox-groups, combobox-input-group, combobox-invalid, combobox-multiple, combobox-popup, combobox-user, combobox-with-checkbox, command-basic, command-developer-actions, command-dialog, command-groups, command-invite-members, command-scrollable, command-search-filter, command-shortcuts, command-with-description, component-header, component-list, component-sidebar, context-menu-basic, context-menu-checkboxes, context-menu-destructive, context-menu-font-style, context-menu-groups, context-menu-icons, context-menu-radio, context-menu-shortcuts, context-menu-sides, context-menu-spell-check, context-menu-submenu, data-table-basic, data-table-editable, data-table-expandable, data-table-pagination, date-picker-basic, date-picker-disabled, date-picker-dob, date-picker-input, date-picker-natural-language, date-picker-neutral, date-picker-range, date-picker-time, dialog-basic, dialog-centered, dialog-close-button, dialog-destructive, dialog-full-screen, dialog-large, dialog-newsletter, dialog-no-close-button, dialog-scrollable-content, dialog-small, dialog-sticky-footer, drawer-dialog, drawer-scrollable-content, drawer-sides, dropdown-menu-avatar, dropdown-menu-basic, dropdown-menu-basic-danger, dropdown-menu-basic-info, dropdown-menu-basic-primary, dropdown-menu-basic-secondary, dropdown-menu-basic-success, dropdown-menu-basic-warning, dropdown-menu-checkboxes, dropdown-menu-checkboxes-icons, dropdown-menu-complex, dropdown-menu-destructive, dropdown-menu-forms, dropdown-menu-icons, dropdown-menu-outline-primary, dropdown-menu-profile-detailed, dropdown-menu-radio-group, dropdown-menu-radio-icons, dropdown-menu-shortcuts, dropdown-menu-split-primary, dropdown-menu-submenu, dropdown-menu-text, empty-avatar, empty-avatar-group, empty-background, empty-card, empty-input-group, empty-no-search-result, empty-outline, empty-with-large-icon, field-checkbox, field-choice-card, field-fieldset, field-group, field-input, field-one-time-password-form, field-radio, field-responsive, field-select, field-slider, field-switch, field-textarea, hover-card-image-preview, hover-card-info-with-icon-badge, hover-card-link-preview, hover-card-sides, hover-card-simple-info-tooltip, income-item, input-badge, input-basic, input-button-group, input-disabled, input-field, input-fieldgroup, input-file, input-form, input-grid, input-group-basic, input-group-block-end, input-group-block-start, input-group-button, input-group-chat-message, input-group-custom, input-group-dropdown, input-group-icon, input-group-in-card, input-group-inline-end, input-group-inline-start, input-group-kbd, input-group-label, input-group-spinner, input-group-text, input-group-textarea, input-group-textarea-examples, input-group-tooltip, input-group-with-addons, input-group-with-buttonsPreview
Live sandbox previews render component source client-side. Where a component can’t be rendered standalone, sh4dcn falls back to its source and install command.
@uiable · accordion-active-bg
npx shadcn@latest add https://uiable.com/r/accordion-active-bg.jsonView source