Registries
ActiveFeaturedComponent library (general)2,026

@diceui

Component library (general) · MIT · data updated 2026-07-08

Dice UI is an accessible shadcn/ui extension built with Radix UI primitives, React, TypeScript, and Tailwind CSS. It ships ~40 advanced components not found in the base shadcn set, including action-bar, angle-slider, avatar-group, badge-overflow, color-picker, color-swatch, combobox, compare-slider, cropper, data-grid, data-table, editable, file-upload, gauge, kanban, listbox, marquee, mask-input, masonry, media-player, mention, phone-input, QR-code, rating, responsive-dialog, scroll-spy, segmented-input, selection-toolbar, sortable, speed-dial, stepper, tags-input, time-picker, timeline, and tour. Also includes utility components (client-only, hitbox, portal, presence). All components are copy-paste installable via the shadcn CLI. Use for: filling gaps in a shadcn/ui project where complex interactive primitives like kanban boards, media players, sortable lists, or color pickers are needed without adopting a full third-party library.

WebsiteDocsGitHub

Install

npx shadcn@latest add https://diceui.com/r/registry/registry.json

Health

StatusActive
Last commit1 week ago
LicenseMIT
Open issues67
ArchivedNo
Stars2,026

Components (242)

action-barangle-slideravatar-groupbadge-overflowbannercheckbox-groupcircular-progresscolor-pickercolor-swatchcompare-slidercroppercomboboxeditablefile-uploadfpsgaugekanbankey-valuelistboxmarqueemask-inputmasonrymedia-playermentionphone-inputrelative-time-cardresponsive-dialogscrollerscroll-spysegmented-inputselection-toolbarsortablespeed-dialstackstatstatusstepperswapqr-coderatingtags-inputtimelinetime-pickertouraction-bar-demoaction-bar-position-demoangle-slider-demoangle-slider-controlled-demoangle-slider-range-demoangle-slider-themes-demoangle-slider-form-demoavatar-group-demoavatar-group-truncation-demoavatar-group-rtl-demoavatar-group-icons-demoavatar-group-custom-overflow-demobadge-overflow-demobadge-overflow-multiline-demobadge-overflow-interactive-demobanner-demo
Components: action-bar, angle-slider, avatar-group, badge-overflow, banner, checkbox-group, circular-progress, color-picker, color-swatch, compare-slider, cropper, combobox, editable, file-upload, fps, gauge, kanban, key-value, listbox, marquee, mask-input, masonry, media-player, mention, phone-input, relative-time-card, responsive-dialog, scroller, scroll-spy, segmented-input, selection-toolbar, sortable, speed-dial, stack, stat, status, stepper, swap, qr-code, rating, tags-input, timeline, time-picker, tour, action-bar-demo, action-bar-position-demo, angle-slider-demo, angle-slider-controlled-demo, angle-slider-range-demo, angle-slider-themes-demo, angle-slider-form-demo, avatar-group-demo, avatar-group-truncation-demo, avatar-group-rtl-demo, avatar-group-icons-demo, avatar-group-custom-overflow-demo, badge-overflow-demo, badge-overflow-multiline-demo, badge-overflow-interactive-demo, banner-demo, banner-stacked-demo, checkbox-group-demo, checkbox-group-animated-demo, checkbox-group-horizontal-demo, checkbox-group-multi-selection-demo, checkbox-group-validation-demo, circular-progress-demo, circular-progress-interactive-demo, circular-progress-colors-demo, color-picker-demo, color-picker-controlled-demo, color-picker-form-demo, color-picker-inline-demo, color-swatch-demo, color-swatch-sizes-demo, color-swatch-transparency-demo, combobox-demo, combobox-custom-filter-demo, combobox-debounced-demo, combobox-groups-demo, combobox-multiple-demo, combobox-tags-demo, combobox-virtualized-demo, compare-slider-demo, compare-slider-controlled-demo, compare-slider-customization-demo, compare-slider-vertical-demo, cropper-demo, cropper-controlled-demo, cropper-file-upload-demo, cropper-shapes-demo, cropper-video-demo, data-grid-demo, data-table-demo, editable-demo, editable-autosize-demo, editable-double-click-demo, editable-form-demo, editable-todo-list-demo, file-upload-demo

Preview

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.

@diceui · action-bar

npx shadcn@latest add https://diceui.com/r/{style}/action-bar.json
View source