Components Playground

A showcase of all available shadcn/ui components in the project

Breadcrumb

Alerts

Heads up!

You can add components to your app using the cli.

Error

Your session has expired. Please log in again.

Buttons

Badges

Default

Secondary

Destructive

Outline

Avatar

CNJD

Cards

Card Title

Card Description

Card content goes here. This is a simple card component.

Notifications

You have 3 unread messages.

Sofia Davis

m@example.com

Form Elements

Password

Bio

Select Framework

Notifications

Accept terms and conditions

Choose an option

Option One

Option Two

Switch & Slider

Airplane Mode Off

Volume: 50

Progress

Progress33%

Accordion

Tabs

Account

Make changes to your account here.

Name

Table

A list of your recent invoices.
Invoice	Status	Method	Amount
INV001	Paid	Credit Card	$250.00
INV002	Pending	PayPal	$150.00
INV003	Unpaid	Bank Transfer	$350.00

Overlays

Dropdown & Hover Card

Skeleton & Scroll Area

Skeleton Loading

Scroll Area

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6

Item 7

Item 8

Item 9

Item 10

Item 11

Item 12

Item 13

Item 14

Item 15

Item 16

Item 17

Item 18

Item 19

Item 20