# shadcn/ui

> Copy-paste React UI components built with Tailwind CSS and Radix primitives.

shadcn/ui is an open-source collection of accessible, composable UI components designed to be copied directly into your codebase rather than installed as an opaque dependency. Built primarily on Radix UI primitives and styled with Tailwind CSS, it gives developers full ownership and customization of component source code.

Website: https://ui.shadcn.com/

Also at: https://github.com/shadcn-ui/ui

## What it is for

- Scaffold an accessible design system for modern Next.js or React applications
- Add responsive dialogs and drawers that switch between modal views on desktop and bottom sheets on mobile
- Implement stacked toast notifications using Sonner
- Add paginated tables, carousels, and resizable layout panels via a simple CLI

## Features

- Code ownership: copy-paste components directly into your project rather than installing a monolithic npm package
- Built-in CLI to initialize and add individual components on demand
- Tailwind CSS styling with support for custom class prefixes to prevent conflicts in existing codebases
- Accessible foundation using Radix UI primitives and other focused libraries like Vaul and Sonner
- Includes complex patterns like Drawer, Carousel, Sonner toast, Resizable panels, and Pagination
- Dark mode support and adaptable theming variables out of the box

## Pricing

Open source. Free, MIT licensed

## Details

- Type: Website
- Category: [Development](https://xiry.app/topics/development.md)
- Topic: [UI Components](https://xiry.app/topics/development/ui-components.md)
- Open source: yes
- Platforms: Command line, Code library, Web
- For: React and Next.js frontend developers building modern web apps
- Alternative to: Chakra UI, MUI, Ant Design, Mantim UI
- Tags: react, tailwind, radix ui, nextjs, design system, components

## Why it was saved

- [@chronark, 22 December 2023](https://x.com/chronark/status/1738261709045764268): New ready-made UI components to reuse in product work.
- [@shadcn, 22 December 2023](https://x.com/shadcn/status/1738283281424982488): New building blocks for product interfaces: Drawer (built on Vaul, dialog on desktop / drawer on mobile), Carousel (Embla-based, swipe gestures and keyboard support), Pagination (with previous/next, works with framework Link), Resizable panel groups, and Sonner toasts. The CLI now auto-prefixes Tailwind classes so components can be added to existing projects like Docusaurus, Nextra, or existing design systems without style conflicts.
- [@shadcn, 22 December 2023](https://x.com/shadcn/status/1738283287519383653): Gives a responsive dialog pattern out of the box: a Dialog on desktop and a bottom Drawer on mobile, with drag handles and gesture support.
- [@shadcn, 23 December 2023](https://x.com/shadcn/status/1738701068249567718): This update adds Drawer, Carousel, Pagination, Sonner (toast notifications) and Resizable components, support for a custom Tailwind prefix in the CLI, and previews a new style with framer-motion animations shipping early next year.
- [@shadcn, 22 December 2023](https://x.com/shadcn/status/1738283295488594057): Feature-rich toast library worth pulling into projects: supports stacking of multiple toasts, an inline action button (e.g. "Undo") inside the toast, and smooth expand/collapse animations, as shown in the demo video.
- [@shadcn, 4 January 2024](https://x.com/shadcn/status/1742938343669965195): The Project of the Year; the go-to component toolkit for React + Tailwind.
- [@shadcn, 22 March 2024](https://x.com/shadcn/status/1771165748708151631): A foundational library for building React interfaces; the person builds software products and this is the canonical launch of a widely used component system.

## Compare

- [Alternatives to Chakra UI](https://xiry.app/alternatives/chakra-ui.md)

## Related

- [Efferd](https://xiry.app/resources/efferd): Pre-built, responsive shadcn/ui blocks and layouts for React applications (Web app, Freemium)
- [Motion](https://xiry.app/resources/motion): Open-source animation library for React, Vue, and vanilla JavaScript (Website, Freemium)
- [React Bits](https://xiry.app/resources/react-bits): Open-source animated and interactive React UI components and backgrounds (Website, Freemium)
- [21st.dev](https://xiry.app/resources/21st-dev): Curated directory of crafted React, Tailwind, and shadcn UI components. (Website, Freemium)
- [lucide-animated](https://xiry.app/resources/lucide-animated): Open-source animated React icons built with Lucide and Motion (Web app, Open source)
- [Magic UI](https://xiry.app/resources/magic-ui): Animated React and Tailwind UI components designed for landing pages (Website, Freemium)

Updated 11 October 2026. Page: https://xiry.app/resources/shadcn-ui-1902

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.
