@coss

The official Cal.com design system, formerly known as Origin UI, now under coss.com/ui. A modern, TypeScript-first component library built on Base UI (not Radix UI), designed for developers and AI-assisted tooling. Covers standard UI primitives with Cal.com's visual language — clean, minimal, developer-focused. Monorepo includes apps/origin legacy components. Free and open source. Use for: adopting the Cal.com design system's Base UI primitives when you want an alternative to Radix-based shadcn with a battle-tested real-world design system behind it.

250 components react shadcn-cli AGPL-3.0

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

Install this registry

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

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

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

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

Components

250 total

ui ui

npx shadcn@latest add https://coss.com/ui/r/ui.json

accordion ui

npx shadcn@latest add https://coss.com/ui/r/accordion.json

alert ui

npx shadcn@latest add https://coss.com/ui/r/alert.json

alert-dialog ui

npx shadcn@latest add https://coss.com/ui/r/alert-dialog.json

autocomplete ui

npx shadcn@latest add https://coss.com/ui/r/autocomplete.json

avatar ui

npx shadcn@latest add https://coss.com/ui/r/avatar.json

badge ui

npx shadcn@latest add https://coss.com/ui/r/badge.json

breadcrumb ui

npx shadcn@latest add https://coss.com/ui/r/breadcrumb.json

button ui

npx shadcn@latest add https://coss.com/ui/r/button.json

calendar ui

npx shadcn@latest add https://coss.com/ui/r/calendar.json

card ui

npx shadcn@latest add https://coss.com/ui/r/card.json

checkbox ui

npx shadcn@latest add https://coss.com/ui/r/checkbox.json

checkbox-group ui

npx shadcn@latest add https://coss.com/ui/r/checkbox-group.json

collapsible ui

npx shadcn@latest add https://coss.com/ui/r/collapsible.json

combobox ui

npx shadcn@latest add https://coss.com/ui/r/combobox.json

command ui

npx shadcn@latest add https://coss.com/ui/r/command.json

context-menu ui

npx shadcn@latest add https://coss.com/ui/r/context-menu.json

dialog ui

npx shadcn@latest add https://coss.com/ui/r/dialog.json

drawer ui

npx shadcn@latest add https://coss.com/ui/r/drawer.json

empty ui

npx shadcn@latest add https://coss.com/ui/r/empty.json

field ui

npx shadcn@latest add https://coss.com/ui/r/field.json

fieldset ui

npx shadcn@latest add https://coss.com/ui/r/fieldset.json

form ui

npx shadcn@latest add https://coss.com/ui/r/form.json

frame ui

npx shadcn@latest add https://coss.com/ui/r/frame.json

group ui

npx shadcn@latest add https://coss.com/ui/r/group.json

input ui

npx shadcn@latest add https://coss.com/ui/r/input.json

otp-field ui

npx shadcn@latest add https://coss.com/ui/r/otp-field.json

input-group ui

npx shadcn@latest add https://coss.com/ui/r/input-group.json

kbd ui

npx shadcn@latest add https://coss.com/ui/r/kbd.json

label ui

npx shadcn@latest add https://coss.com/ui/r/label.json

menu ui

npx shadcn@latest add https://coss.com/ui/r/menu.json

meter ui

npx shadcn@latest add https://coss.com/ui/r/meter.json

number-field ui

npx shadcn@latest add https://coss.com/ui/r/number-field.json

pagination ui

npx shadcn@latest add https://coss.com/ui/r/pagination.json

popover ui

npx shadcn@latest add https://coss.com/ui/r/popover.json

preview-card ui

npx shadcn@latest add https://coss.com/ui/r/preview-card.json

progress ui

npx shadcn@latest add https://coss.com/ui/r/progress.json

radio-group ui

npx shadcn@latest add https://coss.com/ui/r/radio-group.json

scroll-area ui

npx shadcn@latest add https://coss.com/ui/r/scroll-area.json

select ui

npx shadcn@latest add https://coss.com/ui/r/select.json

separator ui

npx shadcn@latest add https://coss.com/ui/r/separator.json

sheet ui

npx shadcn@latest add https://coss.com/ui/r/sheet.json

sidebar ui

npx shadcn@latest add https://coss.com/ui/r/sidebar.json

skeleton ui

npx shadcn@latest add https://coss.com/ui/r/skeleton.json

slider ui

npx shadcn@latest add https://coss.com/ui/r/slider.json

spinner ui

npx shadcn@latest add https://coss.com/ui/r/spinner.json

switch ui

npx shadcn@latest add https://coss.com/ui/r/switch.json

table ui

npx shadcn@latest add https://coss.com/ui/r/table.json

tabs ui

npx shadcn@latest add https://coss.com/ui/r/tabs.json

textarea ui

npx shadcn@latest add https://coss.com/ui/r/textarea.json

toast ui

npx shadcn@latest add https://coss.com/ui/r/toast.json

toggle ui

npx shadcn@latest add https://coss.com/ui/r/toggle.json

toggle-group ui

npx shadcn@latest add https://coss.com/ui/r/toggle-group.json

toolbar ui

npx shadcn@latest add https://coss.com/ui/r/toolbar.json

tooltip ui

npx shadcn@latest add https://coss.com/ui/r/tooltip.json

p-accordion-1 block

Basic accordion

npx shadcn@latest add https://coss.com/ui/r/p-accordion-1.json

p-accordion-2 block

Accordion with one panel open

npx shadcn@latest add https://coss.com/ui/r/p-accordion-2.json

p-accordion-3 block

Accordion allowing multiple panels open

npx shadcn@latest add https://coss.com/ui/r/p-accordion-3.json

p-accordion-4 block

Controlled accordion

npx shadcn@latest add https://coss.com/ui/r/p-accordion-4.json

p-alert-1 block

Basic alert

npx shadcn@latest add https://coss.com/ui/r/p-alert-1.json

p-alert-2 block

Alert with icon

npx shadcn@latest add https://coss.com/ui/r/p-alert-2.json

p-alert-3 block

Alert with icon and action buttons

npx shadcn@latest add https://coss.com/ui/r/p-alert-3.json

p-alert-4 block

Info alert

npx shadcn@latest add https://coss.com/ui/r/p-alert-4.json

p-alert-5 block

Success alert

npx shadcn@latest add https://coss.com/ui/r/p-alert-5.json

p-alert-6 block

Warning alert

npx shadcn@latest add https://coss.com/ui/r/p-alert-6.json

p-alert-7 block

Error alert

npx shadcn@latest add https://coss.com/ui/r/p-alert-7.json

p-alert-dialog-1 block

Alert dialog

npx shadcn@latest add https://coss.com/ui/r/p-alert-dialog-1.json

p-alert-dialog-2 block

Alert dialog with bare footer

npx shadcn@latest add https://coss.com/ui/r/p-alert-dialog-2.json

p-autocomplete-1 block

Basic autocomplete

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-1.json

p-autocomplete-2 block

Disabled autocomplete

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-2.json

p-autocomplete-3 block

Small autocomplete

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-3.json

p-autocomplete-4 block

Large autocomplete

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-4.json

p-autocomplete-5 block

Autocomplete with label

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-5.json

p-autocomplete-6 block

Autocomplete autofilling the input with the highlighted item

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-6.json

p-autocomplete-7 block

Autocomplete auto highlighting the first option

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-7.json

p-autocomplete-8 block

Autocomplete with clear button

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-8.json

p-autocomplete-9 block

Autocomplete with trigger and clear buttons

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-9.json

p-autocomplete-10 block

Autocomplete with grouped items

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-10.json

p-autocomplete-11 block

Autocomplete with limited number of results

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-11.json

p-autocomplete-12 block

Autocomplete with async items loading

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-12.json

p-autocomplete-13 block

Autocomplete form

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-13.json

p-autocomplete-14 block

Autocomplete form

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-14.json

p-autocomplete-15 block

Pill-shaped autocomplete

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-15.json

p-autocomplete-16 block

Address autocomplete with Google Maps Places API

npx shadcn@latest add https://coss.com/ui/r/p-autocomplete-16.json

p-avatar-1 block

Avatar with image and fallback

npx shadcn@latest add https://coss.com/ui/r/p-avatar-1.json

p-avatar-2 block

Fallback-only avatar

npx shadcn@latest add https://coss.com/ui/r/p-avatar-2.json

p-avatar-3 block

Avatars with different sizes

npx shadcn@latest add https://coss.com/ui/r/p-avatar-3.json

p-avatar-4 block

Avatars with different radii

npx shadcn@latest add https://coss.com/ui/r/p-avatar-4.json

p-avatar-5 block

Overlapping avatar group

npx shadcn@latest add https://coss.com/ui/r/p-avatar-5.json

p-avatar-6 block

Avatar with user icon fallback

npx shadcn@latest add https://coss.com/ui/r/p-avatar-6.json

p-avatar-7 block

Avatar with emerald status dot

npx shadcn@latest add https://coss.com/ui/r/p-avatar-7.json

p-avatar-8 block

Avatar with muted status dot

npx shadcn@latest add https://coss.com/ui/r/p-avatar-8.json

p-avatar-9 block

Rounded avatar with top-right emerald status

npx shadcn@latest add https://coss.com/ui/r/p-avatar-9.json

p-avatar-10 block

Avatar with notification badge

npx shadcn@latest add https://coss.com/ui/r/p-avatar-10.json

p-avatar-11 block

Rounded avatar with notification badge

npx shadcn@latest add https://coss.com/ui/r/p-avatar-11.json

p-avatar-12 block

Avatar with verified badge

npx shadcn@latest add https://coss.com/ui/r/p-avatar-12.json

p-avatar-13 block

Small overlapping avatar group

npx shadcn@latest add https://coss.com/ui/r/p-avatar-13.json

p-avatar-14 block

Large overlapping avatar group

npx shadcn@latest add https://coss.com/ui/r/p-avatar-14.json

p-badge-1 block

Basic badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-1.json

p-badge-2 block

Outline badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-2.json

p-badge-3 block

Secondary badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-3.json

p-badge-4 block

Destructive badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-4.json

p-badge-5 block

Info badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-5.json

p-badge-6 block

Success badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-6.json

p-badge-7 block

Warning badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-7.json

p-badge-8 block

Error badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-8.json

p-badge-9 block

Small badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-9.json

p-badge-10 block

Large badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-10.json

p-badge-11 block

Badge with icon

npx shadcn@latest add https://coss.com/ui/r/p-badge-11.json

p-badge-12 block

Badge with link

npx shadcn@latest add https://coss.com/ui/r/p-badge-12.json

p-badge-13 block

Badge with count

npx shadcn@latest add https://coss.com/ui/r/p-badge-13.json

p-badge-14 block

Full rounded badge (pill)

npx shadcn@latest add https://coss.com/ui/r/p-badge-14.json

p-badge-15 block

Badge with number after text

npx shadcn@latest add https://coss.com/ui/r/p-badge-15.json

p-badge-16 block

Status badge - Paid

npx shadcn@latest add https://coss.com/ui/r/p-badge-16.json

p-badge-17 block

Status badge - Pending

npx shadcn@latest add https://coss.com/ui/r/p-badge-17.json

p-badge-18 block

Status badge - Failed

npx shadcn@latest add https://coss.com/ui/r/p-badge-18.json

p-badge-19 block

Selectable badge with checkbox

npx shadcn@latest add https://coss.com/ui/r/p-badge-19.json

p-badge-20 block

Removable badge

npx shadcn@latest add https://coss.com/ui/r/p-badge-20.json

p-breadcrumb-1 block

Breadcrumb with menu example

npx shadcn@latest add https://coss.com/ui/r/p-breadcrumb-1.json

p-breadcrumb-2 block

Breadcrumb with custom separator

npx shadcn@latest add https://coss.com/ui/r/p-breadcrumb-2.json

p-breadcrumb-3 block

Breadcrumb with home icon for home link only

npx shadcn@latest add https://coss.com/ui/r/p-breadcrumb-3.json

p-breadcrumb-4 block

Breadcrumb with folders icon menu

npx shadcn@latest add https://coss.com/ui/r/p-breadcrumb-4.json

p-breadcrumb-5 block

Breadcrumb with icons before text

npx shadcn@latest add https://coss.com/ui/r/p-breadcrumb-5.json

p-breadcrumb-6 block

Breadcrumb with dot separators

npx shadcn@latest add https://coss.com/ui/r/p-breadcrumb-6.json

p-breadcrumb-7 block

Breadcrumb with select dropdown

npx shadcn@latest add https://coss.com/ui/r/p-breadcrumb-7.json

p-button-1 block

Default button

npx shadcn@latest add https://coss.com/ui/r/p-button-1.json

p-button-2 block

Outline button

npx shadcn@latest add https://coss.com/ui/r/p-button-2.json

p-button-3 block

Secondary button

npx shadcn@latest add https://coss.com/ui/r/p-button-3.json

p-button-4 block

Destructive button

npx shadcn@latest add https://coss.com/ui/r/p-button-4.json

p-button-5 block

Destructive outline button

npx shadcn@latest add https://coss.com/ui/r/p-button-5.json

p-button-6 block

Ghost button

npx shadcn@latest add https://coss.com/ui/r/p-button-6.json

p-button-7 block

Link button

npx shadcn@latest add https://coss.com/ui/r/p-button-7.json

p-button-8 block

Extra-small button

npx shadcn@latest add https://coss.com/ui/r/p-button-8.json

p-button-9 block

Small button

npx shadcn@latest add https://coss.com/ui/r/p-button-9.json

p-button-10 block

Large button

npx shadcn@latest add https://coss.com/ui/r/p-button-10.json

p-button-11 block

Extra-large button

npx shadcn@latest add https://coss.com/ui/r/p-button-11.json

p-button-12 block

Disabled button

npx shadcn@latest add https://coss.com/ui/r/p-button-12.json

p-button-13 block

Icon button

npx shadcn@latest add https://coss.com/ui/r/p-button-13.json

p-button-14 block

Small icon button

npx shadcn@latest add https://coss.com/ui/r/p-button-14.json

p-button-15 block

Large icon button

npx shadcn@latest add https://coss.com/ui/r/p-button-15.json

p-button-16 block

Button with icon

npx shadcn@latest add https://coss.com/ui/r/p-button-16.json

p-button-17 block

Link rendered as button

npx shadcn@latest add https://coss.com/ui/r/p-button-17.json

p-button-41 block

Button using the built-in loading prop

npx shadcn@latest add https://coss.com/ui/r/p-button-41.json

p-button-18 block

Custom loading button with manual Spinner

npx shadcn@latest add https://coss.com/ui/r/p-button-18.json

p-button-19 block

Expandable show more/less toggle button

npx shadcn@latest add https://coss.com/ui/r/p-button-19.json

p-button-20 block

Back link button with chevron

npx shadcn@latest add https://coss.com/ui/r/p-button-20.json

p-button-21 block

Card-style button with heading and description

npx shadcn@latest add https://coss.com/ui/r/p-button-21.json

p-button-22 block

Directional pad control buttons

npx shadcn@latest add https://coss.com/ui/r/p-button-22.json

p-button-23 block

Outline like button with count

npx shadcn@latest add https://coss.com/ui/r/p-button-23.json

p-button-24 block

Social login icon buttons

npx shadcn@latest add https://coss.com/ui/r/p-button-24.json

p-button-26 block

Star button with count badge

npx shadcn@latest add https://coss.com/ui/r/p-button-26.json

p-button-27 block

Button group with QR code icon and sign in

npx shadcn@latest add https://coss.com/ui/r/p-button-27.json

p-button-28 block

Button with avatar

npx shadcn@latest add https://coss.com/ui/r/p-button-28.json

p-button-29 block

Pill-shaped button with rounded-full styling

npx shadcn@latest add https://coss.com/ui/r/p-button-29.json

p-button-30 block

Button with animated arrow on hover

npx shadcn@latest add https://coss.com/ui/r/p-button-30.json

p-button-31 block

Button with keyboard shortcut indicator

npx shadcn@latest add https://coss.com/ui/r/p-button-31.json

p-button-32 block

Button with notification badge

npx shadcn@latest add https://coss.com/ui/r/p-button-32.json

p-button-33 block

Paired buttons (Cancel/Save)

npx shadcn@latest add https://coss.com/ui/r/p-button-33.json

p-button-34 block

Button with animated status dot

npx shadcn@latest add https://coss.com/ui/r/p-button-34.json

p-button-35 block

Icon-only copy button with feedback

npx shadcn@latest add https://coss.com/ui/r/p-button-35.json

p-button-36 block

Copy button with feedback

npx shadcn@latest add https://coss.com/ui/r/p-button-36.json

p-button-37 block

Rotating icon button (FAB-style toggle)

npx shadcn@latest add https://coss.com/ui/r/p-button-37.json

p-button-39 block

Hamburger menu button with animated icon

npx shadcn@latest add https://coss.com/ui/r/p-button-39.json

p-button-40 block

Download button with progress and cancel action

npx shadcn@latest add https://coss.com/ui/r/p-button-40.json

p-button-38 block

Social login buttons (Google, X, GitHub)

npx shadcn@latest add https://coss.com/ui/r/p-button-38.json

p-calendar-1 block

Basic calendar

npx shadcn@latest add https://coss.com/ui/r/p-calendar-1.json

p-calendar-3 block

Calendar with date range selection

npx shadcn@latest add https://coss.com/ui/r/p-calendar-3.json

p-calendar-4 block

Calendar with month/year dropdown navigation

npx shadcn@latest add https://coss.com/ui/r/p-calendar-4.json

p-calendar-5 block

Calendar with custom Select dropdown for month/year

npx shadcn@latest add https://coss.com/ui/r/p-calendar-5.json

p-calendar-6 block

Calendar with Combobox dropdown for month/year

npx shadcn@latest add https://coss.com/ui/r/p-calendar-6.json

p-calendar-7 block

Calendar with disabled dates

npx shadcn@latest add https://coss.com/ui/r/p-calendar-7.json

p-calendar-8 block

Calendar with multiple date selection

npx shadcn@latest add https://coss.com/ui/r/p-calendar-8.json

p-calendar-2 block

Calendar with custom cell size

npx shadcn@latest add https://coss.com/ui/r/p-calendar-2.json

p-calendar-9 block

Calendar with rounded day buttons

npx shadcn@latest add https://coss.com/ui/r/p-calendar-9.json

p-calendar-10 block

Calendar with rounded range selection style

npx shadcn@latest add https://coss.com/ui/r/p-calendar-10.json

p-calendar-11 block

Calendar with right-aligned navigation

npx shadcn@latest add https://coss.com/ui/r/p-calendar-11.json

p-calendar-12 block

Calendar with week numbers

npx shadcn@latest add https://coss.com/ui/r/p-calendar-12.json

p-calendar-13 block

Calendar with year-only combobox dropdown

npx shadcn@latest add https://coss.com/ui/r/p-calendar-13.json

p-calendar-14 block

Calendar without arrow navigation (dropdown only)

npx shadcn@latest add https://coss.com/ui/r/p-calendar-14.json

p-calendar-15 block

Calendar with current month button

npx shadcn@latest add https://coss.com/ui/r/p-calendar-15.json

p-calendar-16 block

Calendar with today button

npx shadcn@latest add https://coss.com/ui/r/p-calendar-16.json

p-calendar-17 block

Calendar with date input

npx shadcn@latest add https://coss.com/ui/r/p-calendar-17.json

p-calendar-18 block

Calendar with time input

npx shadcn@latest add https://coss.com/ui/r/p-calendar-18.json

p-calendar-19 block

Calendar with time slots (appointment picker)

npx shadcn@latest add https://coss.com/ui/r/p-calendar-19.json

p-calendar-20 block

Calendar with date presets

npx shadcn@latest add https://coss.com/ui/r/p-calendar-20.json

p-calendar-21 block

Range calendar with date presets

npx shadcn@latest add https://coss.com/ui/r/p-calendar-21.json

p-calendar-22 block

Two months calendar

npx shadcn@latest add https://coss.com/ui/r/p-calendar-22.json

p-calendar-23 block

Three months calendar

npx shadcn@latest add https://coss.com/ui/r/p-calendar-23.json

p-calendar-24 block

Pricing calendar with custom day buttons

npx shadcn@latest add https://coss.com/ui/r/p-calendar-24.json

p-calendar-25 block

Calendar with 24-hour autocomplete time input

npx shadcn@latest add https://coss.com/ui/r/p-calendar-25.json

p-date-picker-1 block

Basic date picker

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-1.json

p-date-picker-2 block

Date range picker

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-2.json

p-date-picker-9 block

Two months calendar with range date

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-9.json

p-date-picker-3 block

Date picker with field and dropdown navigation

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-3.json

p-date-picker-4 block

Date picker with presets

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-4.json

p-date-picker-5 block

Date picker with input

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-5.json

p-date-picker-6 block

Date picker that closes on select

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-6.json

p-date-picker-7 block

Multiple dates picker

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-7.json

p-date-picker-8 block

Date picker with select-like trigger

npx shadcn@latest add https://coss.com/ui/r/p-date-picker-8.json

p-card-1 block

A basic card with header and footer

npx shadcn@latest add https://coss.com/ui/r/p-card-1.json

p-card-2 block

Authentication card with actions

npx shadcn@latest add https://coss.com/ui/r/p-card-2.json

p-card-3 block

Authentication card with separators

npx shadcn@latest add https://coss.com/ui/r/p-card-3.json

p-card-4 block

Framed card with footer

npx shadcn@latest add https://coss.com/ui/r/p-card-4.json

p-card-5 block

Framed card with header

npx shadcn@latest add https://coss.com/ui/r/p-card-5.json

p-card-6 block

Framed card with header and footer

npx shadcn@latest add https://coss.com/ui/r/p-card-6.json

p-card-7 block

Framed card with no rounded bottom

npx shadcn@latest add https://coss.com/ui/r/p-card-7.json

p-card-8 block

Card within a frame and footer

npx shadcn@latest add https://coss.com/ui/r/p-card-8.json

p-card-9 block

Card within a frame and footer

npx shadcn@latest add https://coss.com/ui/r/p-card-9.json

p-card-10 block

Card within a frame with header and footer

npx shadcn@latest add https://coss.com/ui/r/p-card-10.json

p-card-11 block

CardFrame with header action

npx shadcn@latest add https://coss.com/ui/r/p-card-11.json

p-checkbox-1 block

Basic checkbox

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-1.json

p-checkbox-2 block

Disabled checkbox

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-2.json

p-checkbox-3 block

Checkbox with description

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-3.json

p-checkbox-4 block

Card-style checkbox

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-4.json

p-checkbox-5 block

Checkbox form

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-5.json

p-checkbox-group-1 block

Basic checkbox group

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-group-1.json

p-checkbox-group-2 block

Checkbox group with disabled items

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-group-2.json

p-checkbox-group-3 block

Checkbox group with parent checkbox

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-group-3.json

p-checkbox-group-4 block

Nested checkbox group with parent

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-group-4.json

p-checkbox-group-5 block

Checkbox group form

npx shadcn@latest add https://coss.com/ui/r/p-checkbox-group-5.json

p-collapsible-1 block

Basic collapsible

npx shadcn@latest add https://coss.com/ui/r/p-collapsible-1.json

p-combobox-1 block

Basic combobox

npx shadcn@latest add https://coss.com/ui/r/p-combobox-1.json

p-combobox-2 block

Disabled combobox

npx shadcn@latest add https://coss.com/ui/r/p-combobox-2.json

p-combobox-3 block

Small combobox

npx shadcn@latest add https://coss.com/ui/r/p-combobox-3.json

p-combobox-4 block

Large combobox

npx shadcn@latest add https://coss.com/ui/r/p-combobox-4.json

p-combobox-5 block

Combobox with label

npx shadcn@latest add https://coss.com/ui/r/p-combobox-5.json

p-combobox-6 block

Combobox auto highlighting the first option

npx shadcn@latest add https://coss.com/ui/r/p-combobox-6.json

p-combobox-7 block

Combobox with clear button

npx shadcn@latest add https://coss.com/ui/r/p-combobox-7.json

p-combobox-8 block

Combobox with grouped items

npx shadcn@latest add https://coss.com/ui/r/p-combobox-8.json

p-combobox-9 block

Combobox with multiple selection

npx shadcn@latest add https://coss.com/ui/r/p-combobox-9.json

p-combobox-10 block

Combobox with input inside popup

npx shadcn@latest add https://coss.com/ui/r/p-combobox-10.json

p-combobox-11 block

Combobox form

npx shadcn@latest add https://coss.com/ui/r/p-combobox-11.json

p-combobox-12 block

Combobox multiple form

npx shadcn@latest add https://coss.com/ui/r/p-combobox-12.json

p-combobox-13 block

Combobox with start addon

npx shadcn@latest add https://coss.com/ui/r/p-combobox-13.json

p-combobox-14 block

Combobox multiple with start addon

npx shadcn@latest add https://coss.com/ui/r/p-combobox-14.json

p-combobox-15 block

Pill-shaped combobox

npx shadcn@latest add https://coss.com/ui/r/p-combobox-15.json

p-combobox-16 block

Timezone combobox

npx shadcn@latest add https://coss.com/ui/r/p-combobox-16.json

p-combobox-17 block

Timezone combobox with search input

npx shadcn@latest add https://coss.com/ui/r/p-combobox-17.json

p-combobox-18 block

Combobox with select trigger

npx shadcn@latest add https://coss.com/ui/r/p-combobox-18.json

p-combobox-19 block

Combobox multiple with stacked chips

npx shadcn@latest add https://coss.com/ui/r/p-combobox-19.json

p-combobox-20 block

Combobox multiple with stacked divided chips

npx shadcn@latest add https://coss.com/ui/r/p-combobox-20.json

p-command-1 block

Command palette with dialog

npx shadcn@latest add https://coss.com/ui/r/p-command-1.json

p-command-2 block

Command palette with AI assistant

npx shadcn@latest add https://coss.com/ui/r/p-command-2.json

p-dialog-1 block

Dialog with form

npx shadcn@latest add https://coss.com/ui/r/p-dialog-1.json

p-dialog-6 block

Dialog with bare footer

npx shadcn@latest add https://coss.com/ui/r/p-dialog-6.json

p-dialog-2 block

Dialog opened from menu

npx shadcn@latest add https://coss.com/ui/r/p-dialog-2.json

p-dialog-3 block

Nested dialogs

npx shadcn@latest add https://coss.com/ui/r/p-dialog-3.json

p-dialog-4 block

Dialog with close confirmation

npx shadcn@latest add https://coss.com/ui/r/p-dialog-4.json

p-dialog-5 block

Dialog with long content

npx shadcn@latest add https://coss.com/ui/r/p-dialog-5.json

p-drawer-1 block

Simple bottom drawer with close button

npx shadcn@latest add https://coss.com/ui/r/p-drawer-1.json