@diceui

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.

242 components react shadcn-cli MIT

website ↗ github ↗ registry ↗ agent brief (.md) ↗ clone source (200 .json) ↗ clone brief (PROMPT.md) ↗

Install this registry

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

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

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

fetch registry curl -s https://diceui.com/r/registry/registry.json

Components

242 total

action-bar ui

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

angle-slider ui

npx shadcn@latest add https://diceui.com/r/{style}/angle-slider.json

avatar-group ui

npx shadcn@latest add https://diceui.com/r/{style}/avatar-group.json

badge-overflow ui

npx shadcn@latest add https://diceui.com/r/{style}/badge-overflow.json

banner ui

npx shadcn@latest add https://diceui.com/r/{style}/banner.json

checkbox-group ui

npx shadcn@latest add https://diceui.com/r/{style}/checkbox-group.json

circular-progress ui

npx shadcn@latest add https://diceui.com/r/{style}/circular-progress.json

color-picker ui

npx shadcn@latest add https://diceui.com/r/{style}/color-picker.json

color-swatch ui

npx shadcn@latest add https://diceui.com/r/{style}/color-swatch.json

compare-slider ui

npx shadcn@latest add https://diceui.com/r/{style}/compare-slider.json

cropper ui

npx shadcn@latest add https://diceui.com/r/{style}/cropper.json

combobox ui

npx shadcn@latest add https://diceui.com/r/{style}/combobox.json

editable ui

npx shadcn@latest add https://diceui.com/r/{style}/editable.json

file-upload ui

npx shadcn@latest add https://diceui.com/r/{style}/file-upload.json

fps ui

npx shadcn@latest add https://diceui.com/r/{style}/fps.json

gauge ui

npx shadcn@latest add https://diceui.com/r/{style}/gauge.json

kanban ui

npx shadcn@latest add https://diceui.com/r/{style}/kanban.json

key-value ui

npx shadcn@latest add https://diceui.com/r/{style}/key-value.json

listbox ui

npx shadcn@latest add https://diceui.com/r/{style}/listbox.json

marquee ui

npx shadcn@latest add https://diceui.com/r/{style}/marquee.json

mask-input ui

npx shadcn@latest add https://diceui.com/r/{style}/mask-input.json

masonry ui

npx shadcn@latest add https://diceui.com/r/{style}/masonry.json

media-player ui

npx shadcn@latest add https://diceui.com/r/{style}/media-player.json

mention ui

npx shadcn@latest add https://diceui.com/r/{style}/mention.json

phone-input ui

npx shadcn@latest add https://diceui.com/r/{style}/phone-input.json

relative-time-card ui

npx shadcn@latest add https://diceui.com/r/{style}/relative-time-card.json

responsive-dialog ui

npx shadcn@latest add https://diceui.com/r/{style}/responsive-dialog.json

scroller ui

npx shadcn@latest add https://diceui.com/r/{style}/scroller.json

scroll-spy ui

npx shadcn@latest add https://diceui.com/r/{style}/scroll-spy.json

segmented-input ui

npx shadcn@latest add https://diceui.com/r/{style}/segmented-input.json

selection-toolbar ui

npx shadcn@latest add https://diceui.com/r/{style}/selection-toolbar.json

sortable ui

npx shadcn@latest add https://diceui.com/r/{style}/sortable.json

speed-dial ui

npx shadcn@latest add https://diceui.com/r/{style}/speed-dial.json

stack ui

npx shadcn@latest add https://diceui.com/r/{style}/stack.json

stat ui

npx shadcn@latest add https://diceui.com/r/{style}/stat.json

status ui

npx shadcn@latest add https://diceui.com/r/{style}/status.json

stepper ui

npx shadcn@latest add https://diceui.com/r/{style}/stepper.json

swap ui

npx shadcn@latest add https://diceui.com/r/{style}/swap.json

qr-code ui

npx shadcn@latest add https://diceui.com/r/{style}/qr-code.json

rating ui

npx shadcn@latest add https://diceui.com/r/{style}/rating.json

tags-input ui

npx shadcn@latest add https://diceui.com/r/{style}/tags-input.json

timeline ui

npx shadcn@latest add https://diceui.com/r/{style}/timeline.json

time-picker ui

npx shadcn@latest add https://diceui.com/r/{style}/time-picker.json

tour ui

npx shadcn@latest add https://diceui.com/r/{style}/tour.json

action-bar-demo example

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

action-bar-position-demo example

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

angle-slider-demo example

npx shadcn@latest add https://diceui.com/r/{style}/angle-slider-demo.json

angle-slider-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/angle-slider-controlled-demo.json

angle-slider-range-demo example

npx shadcn@latest add https://diceui.com/r/{style}/angle-slider-range-demo.json

angle-slider-themes-demo example

npx shadcn@latest add https://diceui.com/r/{style}/angle-slider-themes-demo.json

angle-slider-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/angle-slider-form-demo.json

avatar-group-demo example

npx shadcn@latest add https://diceui.com/r/{style}/avatar-group-demo.json

avatar-group-truncation-demo example

npx shadcn@latest add https://diceui.com/r/{style}/avatar-group-truncation-demo.json

avatar-group-rtl-demo example

npx shadcn@latest add https://diceui.com/r/{style}/avatar-group-rtl-demo.json

avatar-group-icons-demo example

npx shadcn@latest add https://diceui.com/r/{style}/avatar-group-icons-demo.json

avatar-group-custom-overflow-demo example

npx shadcn@latest add https://diceui.com/r/{style}/avatar-group-custom-overflow-demo.json

badge-overflow-demo example

npx shadcn@latest add https://diceui.com/r/{style}/badge-overflow-demo.json

badge-overflow-multiline-demo example

npx shadcn@latest add https://diceui.com/r/{style}/badge-overflow-multiline-demo.json

badge-overflow-interactive-demo example

npx shadcn@latest add https://diceui.com/r/{style}/badge-overflow-interactive-demo.json

banner-demo example

npx shadcn@latest add https://diceui.com/r/{style}/banner-demo.json

banner-stacked-demo example

npx shadcn@latest add https://diceui.com/r/{style}/banner-stacked-demo.json

checkbox-group-demo example

npx shadcn@latest add https://diceui.com/r/{style}/checkbox-group-demo.json

checkbox-group-animated-demo example

npx shadcn@latest add https://diceui.com/r/{style}/checkbox-group-animated-demo.json

checkbox-group-horizontal-demo example

npx shadcn@latest add https://diceui.com/r/{style}/checkbox-group-horizontal-demo.json

checkbox-group-multi-selection-demo example

npx shadcn@latest add https://diceui.com/r/{style}/checkbox-group-multi-selection-demo.json

checkbox-group-validation-demo example

npx shadcn@latest add https://diceui.com/r/{style}/checkbox-group-validation-demo.json

circular-progress-demo example

npx shadcn@latest add https://diceui.com/r/{style}/circular-progress-demo.json

circular-progress-interactive-demo example

npx shadcn@latest add https://diceui.com/r/{style}/circular-progress-interactive-demo.json

circular-progress-colors-demo example

npx shadcn@latest add https://diceui.com/r/{style}/circular-progress-colors-demo.json

color-picker-demo example

npx shadcn@latest add https://diceui.com/r/{style}/color-picker-demo.json

color-picker-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/color-picker-controlled-demo.json

color-picker-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/color-picker-form-demo.json

color-picker-inline-demo example

npx shadcn@latest add https://diceui.com/r/{style}/color-picker-inline-demo.json

color-swatch-demo example

npx shadcn@latest add https://diceui.com/r/{style}/color-swatch-demo.json

color-swatch-sizes-demo example

npx shadcn@latest add https://diceui.com/r/{style}/color-swatch-sizes-demo.json

color-swatch-transparency-demo example

npx shadcn@latest add https://diceui.com/r/{style}/color-swatch-transparency-demo.json

combobox-demo example

npx shadcn@latest add https://diceui.com/r/{style}/combobox-demo.json

combobox-custom-filter-demo example

npx shadcn@latest add https://diceui.com/r/{style}/combobox-custom-filter-demo.json

combobox-debounced-demo example

npx shadcn@latest add https://diceui.com/r/{style}/combobox-debounced-demo.json

combobox-groups-demo example

npx shadcn@latest add https://diceui.com/r/{style}/combobox-groups-demo.json

combobox-multiple-demo example

npx shadcn@latest add https://diceui.com/r/{style}/combobox-multiple-demo.json

combobox-tags-demo example

npx shadcn@latest add https://diceui.com/r/{style}/combobox-tags-demo.json

combobox-virtualized-demo example

npx shadcn@latest add https://diceui.com/r/{style}/combobox-virtualized-demo.json

compare-slider-demo example

npx shadcn@latest add https://diceui.com/r/{style}/compare-slider-demo.json

compare-slider-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/compare-slider-controlled-demo.json

compare-slider-customization-demo example

npx shadcn@latest add https://diceui.com/r/{style}/compare-slider-customization-demo.json

compare-slider-vertical-demo example

npx shadcn@latest add https://diceui.com/r/{style}/compare-slider-vertical-demo.json

cropper-demo example

npx shadcn@latest add https://diceui.com/r/{style}/cropper-demo.json

cropper-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/cropper-controlled-demo.json

cropper-file-upload-demo example

npx shadcn@latest add https://diceui.com/r/{style}/cropper-file-upload-demo.json

cropper-shapes-demo example

npx shadcn@latest add https://diceui.com/r/{style}/cropper-shapes-demo.json

cropper-video-demo example

npx shadcn@latest add https://diceui.com/r/{style}/cropper-video-demo.json

data-grid-demo example

npx shadcn@latest add https://diceui.com/r/{style}/data-grid-demo.json

data-table-demo example

npx shadcn@latest add https://diceui.com/r/{style}/data-table-demo.json

editable-demo example

npx shadcn@latest add https://diceui.com/r/{style}/editable-demo.json

editable-autosize-demo example

npx shadcn@latest add https://diceui.com/r/{style}/editable-autosize-demo.json

editable-double-click-demo example

npx shadcn@latest add https://diceui.com/r/{style}/editable-double-click-demo.json

editable-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/editable-form-demo.json

editable-todo-list-demo example

npx shadcn@latest add https://diceui.com/r/{style}/editable-todo-list-demo.json

file-upload-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-demo.json

file-upload-chat-input-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-chat-input-demo.json

file-upload-circular-progress-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-circular-progress-demo.json

file-upload-direct-upload-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-direct-upload-demo.json

file-upload-fill-progress-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-fill-progress-demo.json

file-upload-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-form-demo.json

file-upload-uploadthing-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-uploadthing-demo.json

file-upload-validation-demo example

npx shadcn@latest add https://diceui.com/r/{style}/file-upload-validation-demo.json

fps-demo example

npx shadcn@latest add https://diceui.com/r/{style}/fps-demo.json

fps-strategy-demo example

npx shadcn@latest add https://diceui.com/r/{style}/fps-strategy-demo.json

gauge-demo example

npx shadcn@latest add https://diceui.com/r/{style}/gauge-demo.json

gauge-sizes-demo example

npx shadcn@latest add https://diceui.com/r/{style}/gauge-sizes-demo.json

gauge-colors-demo example

npx shadcn@latest add https://diceui.com/r/{style}/gauge-colors-demo.json

gauge-variants-demo example

npx shadcn@latest add https://diceui.com/r/{style}/gauge-variants-demo.json

hitbox-demo example

npx shadcn@latest add https://diceui.com/r/{style}/hitbox-demo.json

hitbox-sizes-demo example

npx shadcn@latest add https://diceui.com/r/{style}/hitbox-sizes-demo.json

hitbox-positions-demo example

npx shadcn@latest add https://diceui.com/r/{style}/hitbox-positions-demo.json

hitbox-radii-demo example

npx shadcn@latest add https://diceui.com/r/{style}/hitbox-radii-demo.json

hitbox-debug-demo example

npx shadcn@latest add https://diceui.com/r/{style}/hitbox-debug-demo.json

segmented-input-demo example

npx shadcn@latest add https://diceui.com/r/{style}/segmented-input-demo.json

selection-toolbar-demo example

npx shadcn@latest add https://diceui.com/r/{style}/selection-toolbar-demo.json

selection-toolbar-info-demo example

npx shadcn@latest add https://diceui.com/r/{style}/selection-toolbar-info-demo.json

segmented-input-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/segmented-input-form-demo.json

segmented-input-rgb-demo example

npx shadcn@latest add https://diceui.com/r/{style}/segmented-input-rgb-demo.json

segmented-input-vertical-demo example

npx shadcn@latest add https://diceui.com/r/{style}/segmented-input-vertical-demo.json

marquee-demo example

npx shadcn@latest add https://diceui.com/r/{style}/marquee-demo.json

marquee-logo-demo example

npx shadcn@latest add https://diceui.com/r/{style}/marquee-logo-demo.json

marquee-vertical-demo example

npx shadcn@latest add https://diceui.com/r/{style}/marquee-vertical-demo.json

marquee-rtl-demo example

npx shadcn@latest add https://diceui.com/r/{style}/marquee-rtl-demo.json

mask-input-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mask-input-demo.json

mask-input-custom-pattern-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mask-input-custom-pattern-demo.json

mask-input-validation-modes-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mask-input-validation-modes-demo.json

mask-input-card-information-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mask-input-card-information-demo.json

mask-input-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mask-input-form-demo.json

kanban-demo example

npx shadcn@latest add https://diceui.com/r/{style}/kanban-demo.json

kanban-dynamic-overlay-demo example

npx shadcn@latest add https://diceui.com/r/{style}/kanban-dynamic-overlay-demo.json

key-value-demo example

npx shadcn@latest add https://diceui.com/r/{style}/key-value-demo.json

key-value-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/key-value-form-demo.json

key-value-validation-demo example

npx shadcn@latest add https://diceui.com/r/{style}/key-value-validation-demo.json

key-value-paste-demo example

npx shadcn@latest add https://diceui.com/r/{style}/key-value-paste-demo.json

listbox-demo example

npx shadcn@latest add https://diceui.com/r/{style}/listbox-demo.json

listbox-grid-demo example

npx shadcn@latest add https://diceui.com/r/{style}/listbox-grid-demo.json

listbox-group-demo example

npx shadcn@latest add https://diceui.com/r/{style}/listbox-group-demo.json

listbox-horizontal-demo example

npx shadcn@latest add https://diceui.com/r/{style}/listbox-horizontal-demo.json

masonry-demo example

npx shadcn@latest add https://diceui.com/r/{style}/masonry-demo.json

masonry-linear-demo example

npx shadcn@latest add https://diceui.com/r/{style}/masonry-linear-demo.json

masonry-ssr-demo example

npx shadcn@latest add https://diceui.com/r/{style}/masonry-ssr-demo.json

media-player-demo example

npx shadcn@latest add https://diceui.com/r/{style}/media-player-demo.json

media-player-audio-demo example

npx shadcn@latest add https://diceui.com/r/{style}/media-player-audio-demo.json

media-player-error-demo example

npx shadcn@latest add https://diceui.com/r/{style}/media-player-error-demo.json

media-player-hls-demo example

npx shadcn@latest add https://diceui.com/r/{style}/media-player-hls-demo.json

media-player-playlist-demo example

npx shadcn@latest add https://diceui.com/r/{style}/media-player-playlist-demo.json

media-player-settings-demo example

npx shadcn@latest add https://diceui.com/r/{style}/media-player-settings-demo.json

mention-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mention-demo.json

mention-custom-filter-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mention-custom-filter-demo.json

mention-custom-trigger-demo example

npx shadcn@latest add https://diceui.com/r/{style}/mention-custom-trigger-demo.json

phone-input-demo example

npx shadcn@latest add https://diceui.com/r/{style}/phone-input-demo.json

phone-input-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/phone-input-form-demo.json

phone-input-custom-countries-demo example

npx shadcn@latest add https://diceui.com/r/{style}/phone-input-custom-countries-demo.json

qr-code-demo example

npx shadcn@latest add https://diceui.com/r/{style}/qr-code-demo.json

qr-code-customization-demo example

npx shadcn@latest add https://diceui.com/r/{style}/qr-code-customization-demo.json

qr-code-formats-demo example

npx shadcn@latest add https://diceui.com/r/{style}/qr-code-formats-demo.json

qr-code-overlay-demo example

npx shadcn@latest add https://diceui.com/r/{style}/qr-code-overlay-demo.json

rating-demo example

npx shadcn@latest add https://diceui.com/r/{style}/rating-demo.json

rating-themes-demo example

npx shadcn@latest add https://diceui.com/r/{style}/rating-themes-demo.json

rating-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/rating-controlled-demo.json

rating-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/rating-form-demo.json

relative-time-card-demo example

npx shadcn@latest add https://diceui.com/r/{style}/relative-time-card-demo.json

relative-time-card-timezones-demo example

npx shadcn@latest add https://diceui.com/r/{style}/relative-time-card-timezones-demo.json

relative-time-card-variants-demo example

npx shadcn@latest add https://diceui.com/r/{style}/relative-time-card-variants-demo.json

responsive-dialog-demo example

npx shadcn@latest add https://diceui.com/r/{style}/responsive-dialog-demo.json

responsive-dialog-confirm-demo example

npx shadcn@latest add https://diceui.com/r/{style}/responsive-dialog-confirm-demo.json

scroller-demo example

npx shadcn@latest add https://diceui.com/r/{style}/scroller-demo.json

scroller-hidden-demo example

npx shadcn@latest add https://diceui.com/r/{style}/scroller-hidden-demo.json

scroller-horizontal-demo example

npx shadcn@latest add https://diceui.com/r/{style}/scroller-horizontal-demo.json

scroller-navigation-demo example

npx shadcn@latest add https://diceui.com/r/{style}/scroller-navigation-demo.json

scroll-spy-demo example

npx shadcn@latest add https://diceui.com/r/{style}/scroll-spy-demo.json

scroll-spy-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/scroll-spy-controlled-demo.json

scroll-spy-vertical-demo example

npx shadcn@latest add https://diceui.com/r/{style}/scroll-spy-vertical-demo.json

sortable-demo example

npx shadcn@latest add https://diceui.com/r/{style}/sortable-demo.json

sortable-dynamic-overlay-demo example

npx shadcn@latest add https://diceui.com/r/{style}/sortable-dynamic-overlay-demo.json

sortable-handle-demo example

npx shadcn@latest add https://diceui.com/r/{style}/sortable-handle-demo.json

sortable-primitive-values-demo example

npx shadcn@latest add https://diceui.com/r/{style}/sortable-primitive-values-demo.json

speed-dial-demo example

npx shadcn@latest add https://diceui.com/r/{style}/speed-dial-demo.json

speed-dial-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/speed-dial-controlled-demo.json

speed-dial-side-demo example

npx shadcn@latest add https://diceui.com/r/{style}/speed-dial-side-demo.json

speed-dial-labels-demo example

npx shadcn@latest add https://diceui.com/r/{style}/speed-dial-labels-demo.json

speed-dial-hover-demo example

npx shadcn@latest add https://diceui.com/r/{style}/speed-dial-hover-demo.json

stack-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stack-demo.json

stack-no-expand-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stack-no-expand-demo.json

stack-side-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stack-side-demo.json

stat-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stat-demo.json

stat-variants-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stat-variants-demo.json

stat-layout-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stat-layout-demo.json

pending-demo example

npx shadcn@latest add https://diceui.com/r/{style}/pending-demo.json

pending-wrapper-demo example

npx shadcn@latest add https://diceui.com/r/{style}/pending-wrapper-demo.json

pending-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/pending-form-demo.json

pending-link-demo example

npx shadcn@latest add https://diceui.com/r/{style}/pending-link-demo.json

pending-switch-demo example

npx shadcn@latest add https://diceui.com/r/{style}/pending-switch-demo.json

status-demo example

npx shadcn@latest add https://diceui.com/r/{style}/status-demo.json

status-variants-demo example

npx shadcn@latest add https://diceui.com/r/{style}/status-variants-demo.json

status-text-only-demo example

npx shadcn@latest add https://diceui.com/r/{style}/status-text-only-demo.json

status-list-demo example

npx shadcn@latest add https://diceui.com/r/{style}/status-list-demo.json

stepper-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stepper-demo.json

swap-demo example

npx shadcn@latest add https://diceui.com/r/{style}/swap-demo.json

swap-animations-demo example

npx shadcn@latest add https://diceui.com/r/{style}/swap-animations-demo.json

stepper-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stepper-form-demo.json

stepper-validation-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stepper-validation-demo.json

stepper-vertical-demo example

npx shadcn@latest add https://diceui.com/r/{style}/stepper-vertical-demo.json

tags-input-demo example

npx shadcn@latest add https://diceui.com/r/{style}/tags-input-demo.json

tags-input-editable-demo example

npx shadcn@latest add https://diceui.com/r/{style}/tags-input-editable-demo.json

tags-input-sortable-demo example

npx shadcn@latest add https://diceui.com/r/{style}/tags-input-sortable-demo.json

tags-input-validation-demo example

npx shadcn@latest add https://diceui.com/r/{style}/tags-input-validation-demo.json

time-picker-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-demo.json

time-picker-step-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-step-demo.json

time-picker-seconds-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-seconds-demo.json

time-picker-placeholder-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-placeholder-demo.json

time-picker-open-on-focus-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-open-on-focus-demo.json

time-picker-input-group-click-action-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-input-group-click-action-demo.json

time-picker-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-controlled-demo.json

time-picker-form-demo example

npx shadcn@latest add https://diceui.com/r/{style}/time-picker-form-demo.json

timeline-demo example

npx shadcn@latest add https://diceui.com/r/{style}/timeline-demo.json

timeline-horizontal-demo example

npx shadcn@latest add https://diceui.com/r/{style}/timeline-horizontal-demo.json

timeline-rtl-demo example

npx shadcn@latest add https://diceui.com/r/{style}/timeline-rtl-demo.json

timeline-alternate-demo example

npx shadcn@latest add https://diceui.com/r/{style}/timeline-alternate-demo.json

timeline-horizontal-alternate-demo example

npx shadcn@latest add https://diceui.com/r/{style}/timeline-horizontal-alternate-demo.json

timeline-custom-dot-demo example

npx shadcn@latest add https://diceui.com/r/{style}/timeline-custom-dot-demo.json

tour-demo example

npx shadcn@latest add https://diceui.com/r/{style}/tour-demo.json

tour-controlled-demo example

npx shadcn@latest add https://diceui.com/r/{style}/tour-controlled-demo.json

utils lib

npx shadcn@latest add https://diceui.com/r/{style}/utils.json

compose-refs lib

npx shadcn@latest add https://diceui.com/r/{style}/compose-refs.json

client-only component

npx shadcn@latest add https://diceui.com/r/{style}/client-only.json

direction-provider component

npx shadcn@latest add https://diceui.com/r/{style}/direction-provider.json

hitbox component

npx shadcn@latest add https://diceui.com/r/{style}/hitbox.json

portal component

npx shadcn@latest add https://diceui.com/r/{style}/portal.json

pending component

npx shadcn@latest add https://diceui.com/r/{style}/pending.json

presence component

npx shadcn@latest add https://diceui.com/r/{style}/presence.json

visually-hidden component

npx shadcn@latest add https://diceui.com/r/{style}/visually-hidden.json

visually-hidden-input component

npx shadcn@latest add https://diceui.com/r/{style}/visually-hidden-input.json

use-as-ref hook

npx shadcn@latest add https://diceui.com/r/{style}/use-as-ref.json

use-isomorphic-layout-effect hook

npx shadcn@latest add https://diceui.com/r/{style}/use-isomorphic-layout-effect.json

use-lazy-ref hook

npx shadcn@latest add https://diceui.com/r/{style}/use-lazy-ref.json

use-mobile hook

npx shadcn@latest add https://diceui.com/r/{style}/use-mobile.json