Skip to content

Guide · Open source

How to use awesome-shadcn-ui: browse and pick shadcn/ui components

Updated · written with AI from the project's own documentation and checked against our catalogue data

awesome-shadcn-ui is a curated, community-style list of third-party projects, component libraries, blocks and resources built around shadcn/ui, a React component toolkit. This guide shows you how to read the list, find components such as calendars, date pickers, forms or dialogs, and check each entry before you rely on it. You will finish with a clear way to shortlist options from the list.

awesome-shadcn/uibirobirobiro/awesome-shadcn-ui · ★ 20.7k · MIT

Quick start

  1. 1Open the repository. Go to the awesome-shadcn-ui GitHub page or the project homepage at awesomeshadcn.dev.
  2. 2Scan the Libs and Components tables. Read the Name and Description columns to find entries that match your need.
  3. 3Narrow by category. Search the page for terms like calendar, date picker, form, dialog or blocks.
  4. 4Open candidate links. Follow the Link column to each project's own page or repository.
  5. 5Check licence and maintenance. Confirm the licence, recent updates and documentation on the project itself before use.
  6. 6Compare two or three options. Pick a shortlist and compare how each one fits your project.

What awesome-shadcn-ui is and what it is not

The repository is an awesome list: a directory of links rather than a software package or a course. The README describes it as a curated list of awesome things related to shadcn/ui, and the project is MIT licensed and written in TypeScript.

The list does not teach React or Tailwind. If you are new to those tools, you will need other learning material first.

  • It is a link directory, not a tutorial.
  • It is not a single library you install.
  • Entries are not described as tested or endorsed by the maintainers.

Open the list and understand the table columns

The main list is organized into tables under the Libs and Components heading. Each row has four columns: Name, Description, Link and Date.

Use the Name and Description columns to scan for what you need. The Link column points to the project's own site or repository, where you should check its details.

  • Name: the project or library name, such as calendar-cn or creatorem-ui.
  • Description: a short summary written by the project or list contributor.
  • Link: the external page for the entry.
  • Date: the date recorded in the README for the entry.

Read the repository locally if you prefer

The README lists a clone command if you want a local copy of the list to search with your own tools. Run it in a terminal where you keep projects.

The source does not describe any other setup steps, so reading the README on GitHub is equally valid.

git clone https://github.com/birobirobiro/awesome-shadcn-ui

Find components for a specific need

Search the page with your browser's find tool for the component you want, such as calendar, date picker, form, dialog or carousel. The list includes entries for these, for example calendar-cn, which is described as a calendar built with shadcn/ui and Tailwind CSS, and confirm-dialog, a confirm dialog built with shadcn/ui.

Designers can look at entries described as UI blocks or templates that follow the shadcn style, such as blocks-so, which describes copy-and-paste building blocks.

  • Search for "calendar" or "date" for calendar and date-picker entries.
  • Search for "dialog" or "modal" for overlay components such as credenza.
  • Search for "blocks" or "template" for UI blocks.

Vet each entry before you install it

The README does not verify maintenance status or licences for the projects it lists. Each entry can have different maintenance and licence terms, so treat the list as a starting point.

Open the linked project and check its licence file, recent activity and documentation yourself. Some entries state their licence in their description, such as blobz, which describes a free MIT-licensed registry and an optional paid hosted API.

  • Confirm the licence on the linked project before using code.
  • Check whether the project is maintained and how recently it was updated.
  • Read the project's own install instructions; the awesome list does not provide them.

What people use it for

  • Finding a ready-made calendar or date-range picker built on shadcn/ui.
  • Comparing third-party billing or pricing components before choosing one.
  • Exploring voice agent or chat interface components that follow the shadcn style.
  • Browsing UI blocks and templates to see what the shadcn ecosystem offers before building from scratch.

Frequently asked questions

Is awesome-shadcn-ui free?

The awesome-shadcn-ui repository is licensed under MIT, as shown on its license badge. The individual projects it links to have their own licences, which you need to check on each project.

How do I install awesome-shadcn-ui?

The list is read online or cloned. The README gives one command, git clone https://github.com/birobirobiro/awesome-shadcn-ui, for a local copy. There is no package to install.

What are the requirements for awesome-shadcn-ui?

The source does not list prerequisites. You can open the list in any browser, and you only need git if you want a local clone.

Are the components in the list tested or endorsed?

No. The README describes the list only as curated and does not say the entries are tested or endorsed by the maintainers. Verify each project before use.

What are alternatives to awesome-shadcn-ui?

The README names other awesome shadcn/ui lists by other maintainers, which you can find by searching GitHub for "awesome shadcn". Compare their entries to see which covers your needs.

Can I use awesome-shadcn-ui if I am new to React?

The list is a link directory and not a learning course. Learn the basics of React and Tailwind CSS first, then use the list to find components.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use awesome-shadcn-ui if you want to explore what exists in the shadcn/ui ecosystem and shortlist third-party components, calendars, forms or blocks. Pick something else, such as a single vetted library or a step-by-step course, if you need a tested, maintained dependency or are learning React from scratch.

Install options & downloads