awesome-shadcn-ui
<div align="center"> <img src="./assets/awesome-logo.svg" alt="logo of awesome-shadcn-ui repository" height="30%" width="30%"> <p align="center"> <h1>Awesome Shadcn UI</h1> A curated list of awesome things related to <a href='https://ui.shadcn.com/'>shadcn/ui</a> </p> </div> <div align="center"> <a href="https://shadcn.batchtool.com/?utm_source=github"> <img src="./assets/awesome-shadcn-ui.jpg" alt="og of awesome-shadcn-ui" height="100%" width="100%"> </a> </div> ## Saas | Name | Description | Link | |------|-------------|------| | Next Saas Starter | Get started quickly with Next.js, Postgres, Stripe, and shadcn/ui. | https://github.com/leerob/next-saas-starter | | SaaS Boilerplate | SaaS Boilerplate built with Next.js + Tailwind CSS + Shadcn UI + TypeScript. ⚡️ Full-stack React application with Auth, Multi-tenancy, Roles & Permissions, i18n, Landing Page, DB, Logging, Testing. | https://github.com/ixartz/SaaS-Boilerplate | | Cloudflare SaaS Kit | An opinionated, batteries-included starter kit for quickly building and deploying SaaS products on Cloudflare. | https://github.com/Dhravya/cloudflare-saas-stack | | Saasfly | An easy-to-use and enterprise-grade Next.js boilerplate. | https://github.com/saasfly/saasfly | | Next Saas Stripe Starter | Open-source SaaS Starter with User Roles & Admin Panel. Built using Next.js 14, Prisma, Neon, Auth.js v5, Resend, React Email, Shadcn/ui, Stripe, Server Actions. | https://github.com/mickasmt/next-saas-stripe-starter | | Relivator Nextjs Template | Build More Efficient, Engaging, and Profitable Online Stores: Relivator Enhances your eCommerce with the Power of shadcn/ui, Next.js 15, React 19, and more. | https://github.com/blefnk/relivator-nextjs-template | | Nextjs Starter Kit | The Ulimate Nextjs Starter Kit. Build your next SAAS product of your dreams. Batteries included. | https://github.com/michaelshimeles/nextjs-starter-kit | | Rapidlaunch | Beautiful Next.js SaaS Starterkits, Blocks and guides. Built using Shadcn ui, Next.js 14, DrizzleORM, Resend, and more. | https://github.com/alifarooq9/rapidlaunch | | Next Supbase Stripe Starter | The highest quality SaaS starter with Next.js, Supabase, Stripe, and shadcn/ui. | https://github.com/KolbySisk/next-supabase-stripe-starter | | Cella | TypeScript template to build local-first SaaS with hono + pg + drizzle + electric-sql + react + shadcn. | https://github.com/cellajs/cella | | Hikari | A complete & open source Nextjs.14, Stripe and Supabase SaaS Starter Template using App Router. | https://github.com/antoineross/Hikari | | Firestarta | Next.js SaaS boilerplate with NextAuth, Prisma, Supabase, Shadcn/ui & Lemon Squeezy Subscriptions. | https://github.com/uixmat/firestarta | | SaasHQ | Saas CRM/ERP Starter Kit for Nextjs Prisma and Postgres. An excellent resource for buildnig things in Nextjs. | https://github.com/saashqdev/saashq | | Convex SaaS | A production-ready Convex Stack for your next SaaS application with Convex Auth, Stripe, TanStack, Resend, Tailwindcss, and shadcn. | https://github.com/get-convex/convex-saas | | Next Money Stripe Starter | Empower your next project with the stack of Next.js 14, Prisma, Supabase, Clerk Auth, Resend, React Email, Shadcn/ui, and Stripe. | https://github.com/virgoone/next-money | ## UI Libs | Name | Description | Link | |------|-------------|------| | Loading UI | A curated, free, open-source collection of spinners, loaders, and loading-state animations for modern web apps. | https://loading-ui.com/ | | Aceternity UI | Copy paste the most trending components and use them in your websites without having to worry about styling and animations. | https://ui.aceternity.com/ | | Magic UI | UI Library for Design Engineers. Animated components and effects you can copy and paste into your apps. | https://github.com/magicuidesign/magicui | | Magic UI Pro | 50+ beautiful sections and templates built with React, Typescript, Tailwind CSS, and Framer Motion. | https://pro.magicui.design/?ref=bytefer | | Horizon UI | The trendiest & innovative Open Source Admin Template for Chakra UI & React. | https://github.com/horizon-ui/horizon-ui-chakra | | Assistant UI | React Components for AI Chat 💬 🚀. | https://github.com/Yonom/assistant-ui | | Cult UI | Components crafted for Design Engineers. Styled using Tailwind CSS, fully compatible with Shadcn, and easy to integrate—just copy and paste. | https://github.com/nolly-studio/cult-ui | | Eldora UI | Eldora UI is a collection of re-usable components that you can copy and paste into your web apps. | https://github.com/karthikmudunuri/eldoraui | | Page UI | Landing page UI components for React & Next.js, built on top of TailwindCSS. | https://github.com/danmindru/page-ui | | Tremor Raw | Copy & paste React components to build modern web applications. Good for building charts. | https://github.com/tremorlabs/tremor-raw | | Syntax UI | Get free access to pre-built, Tailwind CSS-powered components, animations and effects - brought to life using Framer Motion. | https://github.com/SyntaxUI/syntaxui | | JollyUI | shadcn/ui compatible react aria components. | https://github.com/jolbol1/jolly-ui | | Fusion UI | Fusion UI library combining Shadcn/UI and MagicUI. Featuring 150+ free and open-source components. | https://github.com/nyxb-ui/ui | | Farm UI | FarmUI is client first and animation rich ui component library built on top of radix and shadcn as well other primitive providers that we would like to cover. | https://github.com/kinfe123/farm-ui | | Indie UI | Indie UI is a free collection of UI components for building web applications. It is built with React and Tailwind CSS. | https://github.com/Ali-Hussein-dev/indie-ui | | Mixcn UI | 20+ free and open-source animated components built with React, Typescript, Tailwind CSS, and Framer Motion. | https://github.com/taqui-786/mixcnui | | Edil Ozi | Component Library for Developers. Open Source components you can copy and paste to your apps. | https://github.com/Edil-ozi/edil-ozi | | Bundui | A collection of components that you can copy and paste into your applications. Built with Tailwind CSS and Framer Motion. | https://github.com/bundui/components | | Lukacho UI | Next Generation UI Components. | https://ui.lukacho.com/components | | Myna UI | TailwindCSS and shadcn/ui UI Kit for Figma and React. | https://mynaui.com/ | | shadcn/studio | Accelerate your project development with ready-to-use, and fully customizable shadcn ui Components, Blocks, UI Kits, Boilerplates, Templates and Themes with AI Tools | https://shadcnstudio.com/ | | Shadcnblocks | Premium shadcn/ui blocks, component variants, templates, themes, and admin dashboard patterns for React, Next.js, Astro, and Tailwind CSS. | https://www.shadcnblocks.com/ | | Manifest UI | Component library for ChatGPT Apps and MCP Apps | https://ui.manifest.build | | RENBLOX | Reusable React and Next.js blocks built on shadcn/ui, with a visual page builder. | https://renblox.com | | 21st.dev Agent Elements | Open-source registry of agent UI primitives — chat shell, tool-call cards (Bash, Edit, Search, Todo, Plan), clarifying questions, input bar, streaming markdown. Built on React 19, Tailwind v4, and the Vercel AI SDK. | https://agent-elements.21st.dev | ## Templates | Name | Description | Link | |------|-------------|------| | autoflow | pingcap/autoflow is a Graph RAG based and conversational knowledge base tool built with TiDB Serverless Vector Storage. | https://github.com/pingcap/autoflow | | Magic UI Mobile Template | Features interactive app previews, smooth animations, and mobile-first design. Includes customizable sections for features, benefits, pricing, and app store integration. | https://pro.magicui.design/?ref=bytefer | | taxonomy | An open source application built using the new router,server components and everything new in Next.js. | https://github.com/shadcn/taxonomy | | kirimase | A template and boilerplate for quickly starting your next project with shadcn/ui,Tailwind CSS,and Next.js. | https://github.com/nicoalbanese/kirimase | | next-shadcn-dashboard-starter | Admin Dashboard Starter with Next.js 14 and shadcn/ui. | https://github.com/Kiranism/next-shadcn-dashboard-starter | | NextMaster | A highly performant e-commerce template using Next.js. | https://github.com/ethanniser/NextFaster | | shadcn-landing-page | Landing page template using shadcn/ui,React,Typescript and Tailwind CSS. | https://github.com/leoMirandaa/shadcn-landing-page | | chadnext | Quick Starter Template includes Next.js 14 App router,shadcn/ui,LuciaAuth,Prisma,Server Actions,Stripe,Internationalization and more. | https://github.com/moinulmoin/chadnext | | Landing page boilerplate | A versatile landing page boilerplate, ideal for various projects and marketing campaigns. | https://github.com/weijunext/landing-page-boilerplate | | next-starter | A Next.js starter template,packed with features like TypeScript,Tailwind CSS,Next-auth,Eslint,Stripe,testing tools and more. Jumpstart your project with efficiency and style. | https://github.com/Skolaczk/next-starter | | next-wp | Headless Wordpress Starter built with the NextJS App Router and React Server Components | https://github.com/9d8dev/next-wp | | nextjs-mdx-blog | Starter template built with Contentlayer,MDX,shadcn/ui,and Tailwind CSS. | https://github.com/ChangoMan/nextjs-mdx-blog | | shadcn-nextjs-free-boilerplate | Free & Open-source NextJS Boilerplate + ChatGPT API Dashboard Template | https://github.com/horizon-ui/shadcn-nextjs-boilerplate | | shadcn-landing-page | New design 🎉 Nextjs + Shadcn + TypeScript + Tailwind. | https://github.com/nobruf/shadcn-landing-page | | t3-app-template | This is the admin template for T3 Stack and shadcn/ui | https://github.com/gaofubin/t3-app-template | | easy-ui | 50+ High Quality Open Source Website Templates built using NextJS + shadcn/ui + Tailwind CSS + Framer Motion and more. | https://github.com/DarkInventor/easy-ui | | design-system-template | Turborepo + TailwindCSS + Storybook + shadcn/ui | https://github.com/arevalolance/design-system-template | | electron-shadcn | Electron app template with shadcn/ui and a bunch of other libs and tools ready to use. | https://github.com/LuanRoger/electron-shadcn | | shadcn-vue-landing-page | Landing page template using Vue,shadcn-vue,TypeScript,Tailwind CSS | https://github.com/leoMirandaa/shadcn-vue-landing-page | | onyx | Full stack,batteries included MVP Template with NextJS 14,Supabase SSR Auth & Postgres DB with CRUD operations,RBAC,Tanstack React Query,Zod Validation,MDX components,Resend,and more. | https://github.com/rmourey26/onyx | | opendocs | Beautifully designed template that you can use for your projects for free. Accessible. Customizable. Open Source with i18n support. | https://github.com/daltonmenezes/opendocs | | nextMotion | Webdev portfolio template with nodemailer integrated for easy contact form setup. Uses shadcn/ui + tailwindcss + framer-motion. | https://github.com/yoyocharlie/nextMotion | | turborepo-shadcn-ui-tailwindcss | Turborepo starter with shadcn/ui & Tailwind CSS pre-configured for shared ui components. | https://github.com/henriqpohl/turborepo-shadcn-ui-tailwindcss | | turborepo-launchpad | A comprehensive monorepo boilerplate for shadcn projects using Turbo. It features a highly scalable setup ideal for developing complex applications with shared components and utilities. | https://github.com/JadRizk/turborepo-launchpad | | supa-next-shad-auth | A fully responsive,fully type safe,secure server actions,user friendly customizable UI with following best practices. Tech used: NextJS + Supabase + TypeScript + Server Actions + Zod + shadcn/ui. | https://github.com/Sahil-Sharma-23/supa-next-shad-auth | | wordpress-plugin-boilerplate | WordPress Plugin Boilerplate utilizing modern web technologies and tools such as React,TypeScript,SASS,Tailwind CSS,Shadcn UI,Vite,Grunt.js,Storybook,HMR and more. | https://github.com/prappo/wordpress-plugin-boilerplate | | shadcn-registry-template | Template repository for building a custom component registry for shadcn/ui. | https://github.com/vantezzen/shadcn-registry-template | | create-tauri-core | A project template for creating a Tauri app with Vite,React,and Tailwind CSS. | https://github.com/mrlightful/create-tauri-core | | Shadcn UI Templates | A collection of Free & Premium templates and resources for shadcn/ui. | https://shadcnui-templates.com | | horizon-ai-nextjs-shadcn-boilerplate | Premium AI NextJS & shadcn/ui Boilerplate + Stripe + Supabase + OAuth | https://horizon-ui.com/boilerplate-shadcn | | template-next | A clean Next.js template with TypeScript,TailwindCSS,Shadcn/ui,and Prettier. | https://template-next-official.vercel.app/ | | React Starter Kit | A full-stack boilerplate for building modern web applications with Bun, TypeScript, React, tRPC, Drizzle ORM, and Cloudflare Workers. | https://github.com/kriasoft/react-starter-kit |* ## Components | Name | Description | Link | |------|-------------|------| | Shadcn UI Sidebar | A composable, themeable and customizable sidebar component. | https://ui.shadcn.com/docs/components/sidebar | | Novel | Notion-style WYSIWYG editor with AI-powered autocompletion. | https://github.com/steven-tey/novel | | Plate | Rich-text editor with shadcn/ui. | https://github.com/udecode/plate | | Vaul | A drawer component for React. | https://github.com/emilkowalski/vaul | | Number Flow | A React component to transition, format, and localize numbers. | https://github.com/barvian/number-flow | | Auto Form | Automatically render forms for your existing data schema. | https://github.com/vantezzen/autoform | | next-stepper | A dynamic multi-step form. Built with: Next.js, shadcn/ui,zustand, framer-motion. | https://github.com/ebulku/next-stepper | | Form Builder | A dynamic form-building tool that allows users to create, customize, and validate forms seamlessly within web applications. | https://github.com/hasanharman/form-builder | | Shadcn Table V2 | shadcn/ui table component with server-side sorting, filtering, and pagination. | https://github.com/sadmann7/shadcn-table | | Neobrutalism Components | Collection of neobrutalism-styled Tailwind components. | https://github.com/ekmas/neobrutalism-components | | Maily.to | Powerful editor for creating beautiful, pre-designed, mobile-ready emails. | https://github.com/arikchakma/maily.to | | Background Snippet | Ready to use collection of modern background snippets. | https://github.com/ibelick/background-snippets | | Shadcn UI Sidebar | A stunning, functional and responsive retractable sidebar built on top of shadcn/ui. | https://github.com/salimi-my/shadcn-ui-sidebar | | Shadcn UI Expansions | More components built on top of shadcn-ui. | https://github.com/hsuanyi-chou/shadcn-ui-expansions | | Shadcn UI Blocks | A collection of customized Shadcn UI components and blocks that you can copy and paste into your applications. | https://github.com/akash3444/shadcn-ui-blocks | | Stepperize | A library for creating step-by-step workflows in your apps. | https://github.com/damianricobelli/stepperize | | Onborda | An onboarding wizard flow / product tour for Next.js animated by framer motion | https://github.com/uixmat/onborda | | File Uploader | File uploader built with shadcn/ui and react-dropzone. | https://github.com/sadmann7/file-uploader | | Fancy Area | The Textarea is inspired by GitHub's PR comment section. The impressive part is the @mention support including hover cards in the preview. | https://craft.mxkaske.dev/post/fancy-area | | Fancy Box | The Combobox is inspired by GitHub's PR label selector and is powered by shadcn/ui. Almost all elements are radix-ui components, styled with tailwindcss. | https://craft.mxkaske.dev/post/fancy-box | | Fancy Multi Select | The Multi Select Component is inspired by campsite.design's and cal.com's settings forms. | https://craft.mxkaske.dev/post/fancy-multi-select | | Shadcn Extension | An open source component collection , that extends your ui library , built using shadcn component | https://github.com/BelkacemYerfa/shadcn-extension | | Emblor | A fully-featured tag input component built with shadcn/ui. | https://github.com/JaleelB/emblor | | Date Range Picker | DateRangePicker includes preset date ranges, text entry, calendar selection and date comparison. | https://github.com/johnpolacek/date-range-picker-for-shadcn | | Time Picker | A simple TimePicker for your shadcn/ui project. | https://github.com/openstatusHQ/time-picker | | Shadcn Minimal Tiptap | Minimal Tiptap Editor | https://github.com/Aslam97/shadcn-minimal-tiptap | | Shadcn Multi Select Component | A multi-select component designed with shadcn/ui | https://github.com/sersavan/shadcn-multi-select-component | | Credenza | Ready-made responsive modal component for shadcn/ui. | https://github.com/redpangilinan/credenza | | Shadcn Phone Input | Customizable phone input component with proper validation for any country. Built on top of shadcn. | https://github.com/omeralpi/shadcn-phone-input | | Dnd-Kit Shadcn UI | Drag and drop Accessible kanban board implementing using React, @dnd-kit, tailwind and shadcn/ui. | https://github.com/Georgegriff/react-dnd-kit-tailwind-shadcn-ui | | dialog-stack | Composable stacked dialogs for shadcn/ui. | https://github.com/haydenbleasel/dialog-stack | | Enhanced Button | An enhanced version of the default shadcn-button component. | https://github.com/jakobhoeg/enhanced-button | | Sortable | A sortable component built with shadcn/ui, radix ui, and dnd-kit. | https://github.com/sadmann7/sortable | | Zoom Charts | Zoomable Charts on top of shadcn/ui Charts. | https://github.com/shelwinsunga/zoom-chart-demo | | File Vault | File upload component for React. | https://github.com/ManishBisht777/file-vault | | Shadcn Cal Com | A copy of the monthly calendar used by Cal.com with shadcn/ui, Radix Colors and React Aria. | https://github.com/damianricobelli/shadcn-cal-com | | Stocks | Stock Picker using Next.js, React Server Components, and shadcn/ui charts. | https://github.com/aryanvichare/stocks | | Shadcn Image Cropper | Image cropper built with shadcn/ui and react-image-crop | https://github.com/sujjeee/shadcn-image-cropper | | Planner | Planner is a highly adaptable scheduling component tailored for React applications. | https://github.com/UretzkyZvi/planner | | Echo Editor | A modern WYSIWYG rich-text editor base on tiptap and shadcn-ui. | https://github.com/Seedsa/echo-editor | | Shadcn Address Autocomplete | An address autocomplete component built with Google Places API and shadcn components. | https://github.com/NiazMorshed2007/shadcn-address-autocomplete | | Shadcn Tiptap | Collection of custom extensions and toolbars for Tiptap editor. | https://github.com/NiazMorshed2007/shadcn-tiptap | | Shadcn Linear Combobox | A copy of the combobox that Linear uses to set the priority of a task. | https://github.com/damianricobelli/shadcn-linear-combobox | | Country State Dropdown | This Component is built with Nextjs, Tailwindcss, Shadcn-ui & Zustand for state management. | https://github.com/Jayprecode/country-state-dropdown | | Pricing Page Shadcn | Pricing Page template made with Shadcn UI & Next.js 14. Completely customizable | https://github.com/m4nute/pricing-page-shadcn | | Lingua Time | A smart datetime picker which understands natural language input. | https://github.com/nainglinnkhant/lingua-time | | Nextjs Dnd | Sortable Drag and Drop with Next.js, Shadcn UI, and DnD-Kit. | https://github.com/sujjeee/nextjs-dnd | | Shadcn Calendar Component | A calendar date picker component designed with shadcn/ui. | https://github.com/sersavan/shadcn-calendar-component | | Search Address | The SearchAddress component provides a flexible and interactive search interface for addresses, utilizing the powerful Nominatim service from OpenStreetMap. | https://github.com/UretzkyZvi/search-address | | Capture Photo | Capture-Photo is a versatile, browser-based React component designed to streamline the integration of camera functionalities directly into your web applications. | https://github.com/UretzkyZvi/capture-photo | | React Fancy Switch | React Fancy Switch | https://github.com/Aslam97/react-fancy-switch | | Shadcn Datetime Picker | Beautifully crafted datetime picker component using shadcn ui | https://github.com/Maliksidk19/shadcn-datetime-picker | | Crypto Charts | A demo show casing shacn/ui charts with free historical crypto data from pyth. | https://github.com/jstnw10/crypto-charts | | Shadcn Calendar Heatmap | Modern alternative to primitive react heatmaps built on top of shadcn/ui calendar component. | https://github.com/gurbaaz27/shadcn-calendar-heatmap | | Shadcn Cookie Consent | Beautifully designed, customizable cookie consent for web built on top of shadcn-ui and tailwind-css! | https://github.com/r2hu1/shadcn-cookie-consent | | Dnd Dashboard | A beautiful, performant dashboard with drop-to-swap layouts built using Next.js, shadcn/ui, and swapy. | https://github.com/olliethedev/dnd-dashboard | | React Confirm Dialog | React Confirm Dialog | https://github.com/Aslam97/react-confirm-dialog | | Shadcn Timeline | Customizable and re-usable timeline component for you to use in your projects. Built on top of shadcn. | https://github.com/timDeHof/shadcn-timeline | | Image Upload Shadcn | Image upload component | https://github.com/kushagrasarathe/image-upload-shadcn | | Phone Input Shadcn UI | Custom phone number component built with shadcn/ui. | https://www.armand-salle.fr/post/phone-input-shadcn-ui | | Shadcn Drag Table | A drag-and-drop table component using shadcn-ui and next.js | https://github.com/zenoncao/shadcn-drag-table | | Progress Button | About An extension of shadcn/ui button component that uses a state machine to drive a progress UX. | https://github.com/tomredman/ProgressButton | | Shadcn Tree View | A component for hierarchical lists of data with nested levels that can be expanded and collapsed. | https://github.com/mrlightful/shadcn-tree-view | | Shadcn Data Table Advanced Col Opions | Column-resizing option to shadcn/ui DataTable. | https://github.com/danielagg/shadcn-data-table-resize-columns | | Downshift Shadcn Combobox | Combobox/autocomplete component built with shadcn/ui and Downshift. | https://github.com/TheOmer77/downshift-shadcn-combobox | | Shadcn Carousel Testimonials | shadcn UI Carousel Testimonials | https://github.com/johanguse/shadcn-carousel-testimonials | | Shadcn Date Picker | Advanced date picker with range selection, year and month selection, and more. | https://github.com/flixlix/shadcn-date-picker | | Nextjs Link Pagination | Use shadcn pagination components to navigate and update URL params | https://github.com/bryaneaton13/shadcn-next-link-pagination | | Shadcn Spinner | The shadcn-spinner is a lightweight and customizable loading spinner component, designed to be easily integrated into projects based on shadcn. | https://github.com/allipiopereira/shadcn-spinner | | Recursive Dnd Kanban Board | Recursively-generated drag and drop Accessible kanban board implementing using Next.js, @dnd-kit, Tailwind CSS and shadcn/ui | https://github.com/mehrdadrafiee/recursive-dnd-kanban-board | | Clerk Elements | Composable components that can be used to build custom UIs on top of Clerk's APIs. | https://clerk.com/docs/customization/elements/examples/shadcn-ui | | Simplekit | Responsive connect wallet and account component built on top of Wagmi and shadcn/ui. | https://github.com/vaunblu/SimpleKit | ## Colors And Customizations | Name | Description | Link | |------|-------------|------| | Gradient Picker | Fancy Gradient Picker built with shadcn/ui, Radix UI and Tailwind CSS. | https://github.com/Illyism/gradient-picker | | UI Colorgen | An application designed to assist you with color configuration of shadcn/ui. | https://github.com/mickasmt/ui-colorgen | | Shadcn UI Customizer | POC - shadcn/ui themes with color pickers | https://github.com/Railly/shadcn-ui-customizer | | Clerk Shadcn Theme | Easily synchronize your Clerk components with your shadcn/ui styles. | https://github.com/stormynight9/clerk-shadcn-theme | | Navnote/rangeen | Tool that helps you to create a colour palette for your website. | https://github.com/navnote/rangeen | | Shadcn Theme Editor | Shadcn Theme Editor is a user-friendly component designed to simplify the process of managing and customizing theme colors in Shadcn-based projects. | https://github.com/programming-with-ia/shadcn-theme-editor/ | | 10000+Themes for Shadcn UI | 10000+ Themes for shadcn/ui. | https://ui.jln.dev/ | | Dizzy | Customize font, icons, colors, spacing, radii, and shadows. | https://dizzy.systems/ | | Ewgenius/ui | Create custom themes for shadcn/ui effortlessly using vibrant palettes from Radix Colors. | https://ui.ewgenius.me/shadcn-radix-colors | | Zippy Shadcn UI Theme Generator. | Easily create custom themes from a single colour that you can copy and paste into your apps. | https://zippystarter.com/tools/shadcn-ui-theme-generator | ## Tools | Name | Description | Link | |------|-------------|------| | Fluid Tailwind | Build better responsive designs in less code. | https://github.com/barvian/fluid-tailwind | | Opensearch AI | SearchGPT / Perplexity clone,but personalised for you. | https://github.com/supermemoryai/opensearch-ai | | Shadcn Chat | CLI for adding customizable and re-usable chat components to your applications. | https://github.com/jakobhoeg/shadcn-chat | | Memfree | Open Source Hybrid AI Search Engine,Instantly Get Accurate Answers from the Internet,Bookmarks,Notes,and Docs. Support One-Click Deployment. It built using Next.js,Typescript,and shadcn/ui. | https://github.com/memfreeme/memfree | | Shadcn Form Builder | Create forms with Shadcn,react-hooks-form and zod within minutes | https://github.com/hasanharman/form-builder | | Invoify | An invoice generator app built using Next.js,Typescript,and shadcn/ui | https://github.com/aliabb01/invoify | | Form Builder | UI based codegen tool to easily create Beautiful and Type safe @shadcn/ui forms. | https://github.com/AlandSleman/FormBuilder | | Tinte | An opinionated theme generator 🎨 (VS Code, shadcn/ui) | https://github.com/Railly/tinte | | UI Builder | A React component editor that provides a no-code,visual way to create UIs,fully compatible with shadcn/ui and custom components. | https://github.com/olliethedev/ui-builder | | Cut It | Link shortener built using Next.js App Router,Server Actions,Drizzle ORM,Turso and styled with shadcn/ui. | https://github.com/mehrabmp/cut-it | | Quack DB | Open-source in-browser DuckDB SQL editor | https://github.com/mattf96s/QuackDB | | Bento Hub | BentoHub is a application where you can create a bento grid for your GitHub profile readme. | https://github.com/amittam104/BentoHub | | Translate App | Translate App using TypeScript,Tailwind CSS,NextJS,Bun,shadcn/ui,AI-SDK/OpenAI,Zod | https://github.com/developaul/translate-app | | Pastecode | Pastebin alternative built with Typescript,Next.js,Drizzle,shadcn/ui,RSC | https://github.com/Quorin/PasteCode.app | | Typelabs | MonkeyType inspired typing test app built with React,shadcn,and Zustand at it's core. | https://github.com/imsandeshpandey/typelabs | | Jobsync | JobSync is a job seekers' assistant to manage job search efficiently. | https://github.com/Gsync/jobsync | | Proxmox Helper Scripts | A catalog of scripts for your Proxmox VE homelab,built with the Next.js App Router and styled with shadcn/ui. | https://github.com/BramSuurdje/proxmox-helper-scripts | | Shadcn Zod Form | CLI tool to generate shadcn/ui forms from zod schemas. | https://github.com/ilyichv/shadcn-zod-form | | Wallhaven Desktop | Wallhaven Wallpaper software desktop. Create a wallhaven api based client,a true wallpaper software. use Farm,Tauri,React19,shadcn/ui. | https://github.com/ErKeLost/wallhaven-desktop | | Awesome Docs Gallery | A crowdsourced, open-source gallery for high-quality dev docs. | https://github.com/Hashnode/awesome-docs-gallery | | Sharable Form Builder | A sharable form builder for creating forms and sharing your form link,based on shadcn/ui and Next.js. | https://github.com/ayoubben18/sharable-form-builder | | Down Dev Detector | This app lists all the services currently down and uses service Atlassian Status Page and others (soon). | https://github.com/birobirobiro/downdevdetector | | Xuneix | A link rotation tool for enhanced admin panel security. It includes dynamic URLs,expiring tokens,customizable rotation. Easily setup with shadcn/ui. Integrates with Vercel KV. | https://github.com/theteleporter/xuneix | | 5devs | A website to get fake brazilian data for testing purposes. | https://www.5devs.com.br/ | | CV Forge | Resume builder,build with @shadcn/ui,react-hook-form and react-pdf | https://cvforge.app | | Imgsrc | Generate beautiful Open Graph images with zero effort. | https://imgsrc.io/ | | Shadcn Pricing Page Generator | The easiest way to get a React pricing page with shadcn/ui,Radix UI and/or Tailwind CSS. | https://shipixen.com/shadcn-pricing-page | | V0 | Vercel's generative UI system,built on shadcn/ui and TailwindCSS,allows effortless UI generation from text prompts and/or images. It produces React and HTML code,integration is also possible via v0 CLI command. | https://v0.dev/ | ## Extensions | Name | Description | Link | |------|-------------|------| | Shadcn UI | Add components from shadcn/ui directly from VS Code. | https://marketplace.visualstudio.com/items?itemName=SuhelMakkad.shadcn-ui | | Vscode Shadcn Svelte | VS Code extension for shadcn/ui components in Svelte projects. | https://marketplace.visualstudio.com/items?itemName=Selemondev.vscode-shadcn-svelte&ssr=false#overview | | Vscode Shadcn UI Snippets | Easily import and use shadcn-ui components with ease using snippets within VSCode. Just type cn or shadcn in you jsx/tsx file and you will get a list of all the components to choose from. | https://marketplace.visualstudio.com/items?itemName=VeroXyle.shadcn-ui-snippets | | Shadcn Color Preview | Shadcn HSL Preview extension for Visual Studio Code. | https://marketplace.visualstudio.com/items?itemName=dexxiez.shadcn-color-preview | | Raycast Shadcn | Raycast extension to Browse shadcn/ui documentation, components and examples. | https://www.raycast.com/luisFilipePT/shadcn-ui | | Designg UI | A Chrome Browser Extension for managing colors in CSS Variables. | https://www.designgui.io/ | | Chat With Youtube | A chrome extension is designed to give you the ability to efficiently summarize videos, easily search for specific parts, and enjoy additional useful features. | https://github.com/PaoloJN/youtube-ai-extension | | Shadcn UI Components Manager | A plugin for Jetbrain products. It allows you to manage your shadcn/ui components across Svelte, React, Vue, and Solid frameworks with this plugin. Simplify tasks like adding, removing, and updating components. | https://plugins.jetbrains.com/plugin/23479-shadcn-ui-components-manager | ## Ports | Name | Description | Link | |------|-------------|------| | Svelte | Svelte port of shadcn/ui | https://github.com/huntabyte/shadcn-svelte | | Vue | Vue port of shadcn/ui | https://github.com/radix-vue/shadcn-vue | | React Native | Universal shadcn/ui for React Native featuring a focused collection of components. | https://github.com/mrzachnugent/react-native-reusables | | Angular | Angular port of shadcn/ui | https://github.com/goetzrobin/spartan | | Flutter | Flutter port of shadcn/ui | https://github.com/nank1ro/shadcn-ui | | Nativecn UI | Beautiful and customizable React Native components. | https://github.com/Mobilecn-UI/nativecn-ui | | Shadcn UI on Rails | Ruby port of shadcn/ui | https://github.com/aviflombaum/shadcn-rails | | SaladUI | Phoenix Liveview port of shadcn/ui | https://github.com/bluzky/salad_ui | | Shadcn Solid | Solid port of shadcn/ui | https://github.com/hngngn/shadcn-solid | | Swift | Swift port of shadcn/ui | https://github.com/Mobilecn-UI/swiftcn-ui | | Shadcn Kotlin | Kotlin port of shadcn/ui | https://github.com/dead8309/shadcn-kotlin | | Franken UI | HTML-first,framework-agnostic,beautifully designed components that you can truly copy and paste into your site. Accessible. Customizable. Open Source. | https://www.franken-ui.dev/ | ## Animations | Name | Description | Link | |------|-------------|------| | Animata | Bring your site to life with easy to use animation & interaction code. Copy. Paste. Animate. | https://github.com/codse/animata | | Motionvariants | A collection of handmade Framer Motion variants made for your next project. | https://github.com/chrisabdo/motionvariants | ## Design System | Name | Description | Link | |------|-------------|------| | Craft Design System | Design system for building websites FAST! Uses Next.js, Tailwind, React, Typescript, and shadcn/ui. | https://github.com/brijr/craft | | Storybook Shadcn UI | Every component recreated in Figma. | https://github.com/JheanAntunes/storybook-shadcn | | Fellipeutaka/ui | All shadcn/ui components registered in the storybook by JheanAntunes | https://github.com/fellipeutaka/ui | ## Platforms | Name | Description | Link | |------|-------------|------| | Plotwist | Open-source easy management and reviews of your movies, series and animes. | https://github.com/plotwist-app/plotwist | | Infinitunes | A Simple Music Player Web App built using Next.js,shadcn/ui,Tailwind CSS,DrizzleORM and more... | https://github.com/rajput-hemant/infinitunes | | Bolhadev | The quickest path to learn English is speaking it regularly. Just find someone to chat with. | https://github.com/brunocroh/bolhadev.chat | | Enjoytown | A free anime,manga,movie,tv-shows streaming platform. Built with Nextjs,shadcn/ui | https://github.com/avalynndev/enjoytown | | Kd | Ad-free Kdrama streaming app. Built with Nextjs,Drizzle ORM,NeonDB and shadcn/ui | https://github.com/gneiru/kd | | anonypost | Share your thoughts and experiences anonymously by posting on the platform. Crafted using t3-stack | https://github.com/avalynndev/anonypost | | Memergez | Quickly generate memes by entering text or an avatar URL,with support for many meme commands. | https://github.com/avalynndev/memergez | | Grade Calculator | A grade calculator/dashboard for students,aiming to provide a better overview on the academic performance. | https://github.com/noahstreller/grade-calculator | | Crept Studio | Crept is a free Open Source project,made on top of Next.js,Tailwind CSS and Shadcn UI. You can use it to deliver free Tv shows and Movies. | https://github.com/theteleporter/crept-main | ## Portfolios | Name | Description | Link | |------|-------------|------| | shubhporwal.me | An eye-catching developer Portfolio,built on NextJS,GSAP,Tailwind and React. | https://github.com/shubh73/devfolio | | andrewsam.xyz | A revamped version of the popular tailwind-nextjs-starter-blog using shadcn/ui,along with a resume section and experience timeline component. | https://github.com/andrew-sameh/andrewsam.xyz | ## Others | Name | Description | Link | |------|-------------|------| | Payment Gateways Demo | This project demonstrates the integration of multiple payment gateways, including Stripe, Razorpay, PayPal and Coinbase using Next.js 14. It showcases how to implement these popular payment solutions in a web application. | https://github.com/PremPrakashCodes/payment-gateways | | Shadcn Admin | Admin Dashboard UI built with Shadcn and Vite. | https://github.com/satnaing/shadcn-admin | ## Contributing Discover something fantastic, like a package, article, blog, video, or any other valuable resource? Feel free to contribute by sending a pull request! Your participation is highly appreciated. Thank you! ❤️ ## Contributors Thanks goes to all these wonderful people: <a href="https://github.com/bytefer/awesome-shadcn-ui/graphs/contributors"> <img src="https://contrib.rocks/image?repo=bytefer/awesome-shadcn-ui" /> </a>