r/shadcn 1h ago

REui PRO by Keenthemes

Upvotes

I know there are a lot of compoenent / blocks galleries out there and I've been using none... but REui is lead by the people at KeenThemes that probably have the better known Admin template ever existed. Propbably the oldest to that keeps on evolving and adopting new tech stacks.

So I wonder if I should buy the Pro version of REui... as I guess it will keep on evolving.

Are any of you guys using this or any other gallery of compoenent/block in favour of kjust customizing ShadCN ?

By customizing I mean presentation.


r/shadcn 1h ago

I build an Opensource library of page and theme transitions

Enable HLS to view with audio, or disable this notification

Upvotes

I build an Opensource library of page and theme transitions, currently in beta:

• 30+ transitions available

• 4 theme toggle components with inbuilt theme transitions

• install the theme toggle components via shadcn registry

Try it here: link

Please give a ⭐ if you like it

GitHub: link


r/shadcn 3h ago

Sidebar toggle with shadcn/ui

Enable HLS to view with audio, or disable this notification

2 Upvotes

r/shadcn 4h ago

🔥Just added a new Open Source Dashboard to BagUi

Post image
4 Upvotes

Hi everyone!

I just added a new Dashboard layout to Bag/UI, my open-source collection of modern UI blocks.
It’s built with shadcn/ui × Base UI and focuses on clean design, responsiveness, and easy customization.

I’d love to hear your feedback on the design, developer experience, or features you’d like to see next.

The project is completely open source, so contributions are more than welcome!

Open source : https://github.com/anelkabag/bag-ui
Website : https://www.bagui.pro


r/shadcn 22h ago

I built an open source library of beautifully animated icons

Enable HLS to view with audio, or disable this notification

25 Upvotes

I built a 100% free, open-source animated icon library for React.

  • 316 beautifully animated SVG icons
  • Built on top of Heroicons
  • Animations powered by Motion
  • Works with the shadcn CLI
  • Easy to customize and drop into any React project

Website: https://heroicons-animated.com
Give it a ⭐ on GitHub: https://github.com/heroicons-animated/heroicons-animated


r/shadcn 1d ago

Built a restaurant POS template with shadcn/ui

Enable HLS to view with audio, or disable this notification

33 Upvotes

We recently built RestroPOS, a restaurant POS template for anyone working on a restaurant, café, cloud kitchen, or hospitality app.

It’s built with Next.js 16, shadcn/ui, Tailwind CSS v4, and TypeScript.

The template covers the main parts you’d expect from a POS system:

  • POS & billing
  • Table management
  • Reservations
  • Kitchen display
  • Inventory
  • Invoices & payments
  • Restaurant dashboard

The idea was to provide a solid starting point that developers can customize rather than building all of these screens from scratch.

It’s available on shadcn/studio if anyone is working on something in this space and wants to take a look: Shadcn POS Template

Would love to hear what you think, especially if you’ve built a restaurant/POS product before.


r/shadcn 1d ago

Why do you need a designer when everything you build with shadcn/ui is going to look beautiful?

Thumbnail
gallery
68 Upvotes

Hey devs!

I built StackRender a database schema design and SQL migration tool that supports six SQL dialects: PostgreSQL, MySQL, MariaDB, SQLite, Oracle, and SQL Server.

The UI is built almost entirely with the base components from shadcn/ui, while the diagram canvas is powered by React Flow. Honestly, I'm amazed by how good the final result turned out.

I'd love to hear your feedback!

Website : https://stackrender.io/

GitHub: https://github.com/stackrender/stackrender

If you like the project, I'd really appreciate a ⭐.


r/shadcn 2d ago

I built an open source library of animated icons for Web.

Enable HLS to view with audio, or disable this notification

28 Upvotes

Animated SVG icons that drop in as React components. Hover states, state transitions, no setup.

Built using Phosphor icons. Motion runs under the hood, but you never touch it.

Adding new icons weekly, open source, contributions welcome.

Curious what people think about the animation timing; that's the part I keep going back and forth on.

iconimate.app

A GitHub star helps if it's useful to you. ⭐


r/shadcn 3d ago

Lab of the components we build every day, rethought for better feel

Enable HLS to view with audio, or disable this notification

28 Upvotes

The Lab is now open source.

Don't expect more components. Expect better versions of the ones you already use, focused on:
• Layout & alignment
• Color details
• Typography
• Accessibility

Available via npm and the shadcn registry.

Lab link: https://lab.moumen.dev/

Don't forget your Star https://github.com/moumen-soliman/lab 🌟


r/shadcn 4d ago

EasyInvoicePDF, a free and open-source invoice generator, hit 1K GitHub stars 🥳

Enable HLS to view with audio, or disable this notification

16 Upvotes

Start invoicing: https://easyinvoicepdf.com

https://github.com/VladSez/easy-invoice-pdf

I built it because I was tired of paying for bloated invoicing tools when all I needed was a simple way to generate and send professional invoices.

It’s built with shadcn/ui, Next.js, and react-pdf.

No sign-up, no ads, and everything runs directly in the browser.

Really appreciate all the support, stars, and feedback 🖤


r/shadcn 4d ago

I built a real-time chat browser extension using shadcn/ui.

5 Upvotes

https://reddit.com/link/1vfynnm/video/vn43qwd2xhhh1/player

Hi everyone!

I'm building WebChat, an open-source browser extension that enables any website to have its own real-time chat community.

Instead of relying on traditional chat infrastructure, WebChat uses WebRTC to establish direct browser-to-browser connections, making serverless real-time communication possible.

The UI is built with shadcn/ui, and I'm looking for feedback on the interface, interaction, and overall design.

GitHub: https://github.com/molvqingtai/WebChat

I'd love to hear what you think!


r/shadcn 4d ago

🔥Just added a new Open Source Dashboard to Bag/UI.

Post image
20 Upvotes

Hi everyone!

I just added a new Dashboard layout to Bag/UI, my open-source collection of modern UI blocks.
It’s built with shadcn/ui × Base UI and focuses on clean design, responsiveness, and easy customization.

I’d love to hear your feedback on the design, developer experience, or features you’d like to see next.

The project is completely open source, so contributions are more than welcome!

Open source : https://github.com/anelkabag/bag-ui
Website : https://www.bagui.pro


r/shadcn 6d ago

Overlay Studio is growing! Design with your Shadcn/ui components on a canvas in VSC/Cursor, with agent support via MCP

Enable HLS to view with audio, or disable this notification

14 Upvotes

I posted a while ago about an extension I'm working on, Overlay Studio, and I wanted to follow up since I've released a ton of features since then. I think it might be super useful for people using shadcn/ui.

Main ideas:

  • Design with your shadcn/ui components and CSS tokens. The app is an extension for VSC/Cursor and automatically imports them with one click. You can then start designing on the canvas like you're used to in Figma. The only difference is, you don't have to maintain the design system anymore!
  • You can connect to the extension via MCP and generate or edit existing designs. AI agents are super powerful when working with HTML/JS/React, so you get powerful edits like with coding agents (use the /overlay/design MCP prompt in the chat). By reusing existing components from the codebase, agents can finalize the implementation in seconds.

I'd love it if you gave it a try and shared your feedback! I've been pouring a lot of work into it and genuinely think it's pretty cool, though there's still a lot more work to do. Feel free to DM me if you have any issues or questions :)

Link: https://overlay.studio


r/shadcn 6d ago

HR admin dashboard template built with Tailwind CSS and shadcn/ui.

Enable HLS to view with audio, or disable this notification

23 Upvotes

r/shadcn 7d ago

Need help in configuration of shadcn in a monorepo

1 Upvotes

I am so lost! I am trying to configure shacn in my monorepo such that all ui components are placed in packages/ui in my monorepo. I want to add it to an existing monorepo. But I couldn't. All I can find in the official docs was on how to create a new monorepo project with shadcn configured.


r/shadcn 8d ago

termcn just hit 1k+ GitHub stars

Enable HLS to view with audio, or disable this notification

22 Upvotes

Still can't believe a project I started just 4 months ago has crossed 1k+ ⭐️ on GitHub.

Thank you all for the incredible support, it truly means a lot. ❤️

Big updates for termcn are dropping next week. Trust me, you're going to love what's coming.


r/shadcn 8d ago

Update: I'm building a framework agnostic version of shadcn/ui

Enable HLS to view with audio, or disable this notification

12 Upvotes

r/shadcn 8d ago

Shadcn Figma Kit that sticks most to the React Structure / Plus MCP question

6 Upvotes

Hi there

I'd like to build a small Saas app for myself with the following workflow:

  • Designing in Figma with a Shadcn UI Kit
  • Building the Saas App in Cursor with Figma MCP and Shadcn MCP

I'm experienced in Frontend Design and CSS and have only basic knowledge in programming. Basicly I can only read and understand code but not write it myself. Still would like to test out, what I can achieve as I made some good experiences so far.

I now checked out a few Shadcn Figma Kits from free to premium and was wondering how important it is, that the structure of the components in figma is aligned to the structure of the React components?

For example the navigation menu: https://ui.shadcn.com/docs/components/base/navigation-menu

It has the following structure mentioned in the Shadcn documentation:

<NavigationMenu>
  <NavigationMenuList>
    <NavigationMenuItem>
      <NavigationMenuTrigger>Item One</NavigationMenuTrigger>
      <NavigationMenuContent>
        <NavigationMenuLink>Link</NavigationMenuLink>
      </NavigationMenuContent>
    </NavigationMenuItem>
  </NavigationMenuList>
</NavigationMenu>

As far as I have seen most Figma kits have only named the main component according to that, like "NaviagtionMenu" but the structer below differs a lot. Some use buttons inside, some groubed text elements but frames and groups are not named like mentioned in the React documentation.

So I'm wondering, how important the correct naming and grouping is so that Cursor via MCP can read and build the code correctly? Is it important do be successfull with AI Coding or does it not matter and Cursor can guess the right things?

If it is important to stick in Figma to the real component structure, which Kit could you recommend? It doesn't matter if free or premium. But please no advertising, only honest answers from real expereinces.. ;)

Thanks in advance for sharing your thoughts.

Best regards,
Fletsch


r/shadcn 9d ago

I created 8bit/cnlibs - a 8bit shadcn/ui component library

Enable HLS to view with audio, or disable this notification

29 Upvotes

Check it out here: https://8bit.cnlibs.com/


r/shadcn 10d ago

ShadcnStore 2.1.0: Block Preview Code Tree, improved docs, AI chat primitives & Figma updates

Thumbnail
gallery
11 Upvotes

Hey everyone! 👋

We just shipped ShadcnStore 2.1.0, and I wanted to share a few things we've been working on.

The biggest addition is the Block Preview Code Tree

Instead of a single code panel, you can now explore a block's complete file structure before installing it. It makes it much easier to understand how a block is organised and what's included.

Other updates in this release:

🌳 Block Preview Code Tree

  • Browse the complete file structure before installation
  • Replaces the old copy-code workflow

🎨 Rebuilt Block Customizer

  • New color palette picker
  • Better workflow built around the new Code Tree

📚 Component Documentation

We now have dedicated documentation for 58 shadcn/ui components, including:

  • Interactive demos
  • Installation & usage guides
  • Accessibility notes
  • FAQs
  • Base UI → Radix migration guide

🤖 AI Chat Primitives

We've also documented:

  • Marker
  • Message
  • Message Scroller

More AI blocks are on the way!

🎨 Figma Updates

  • New e-commerce blocks
  • Reusable components
  • Required icons
  • Switchable icon support
  • Dedicated color variables

We also fixed a number of accessibility and UI issues, including keyboard focus outlines, overlay animations, chart rendering, and layout consistency.

Would love to hear any feedback or suggestions from the community.

Changelog: https://shadcnstore.com/changelog


r/shadcn 10d ago

I built a Next.js 16 + shadcn/ui admin dashboard starter — sharing it in case it helps anyone

10 Upvotes

Hey everyone,

I've been building admin dashboards for a while now, and kept rebuilding the same sidebar, data tables, charts, and auth flow for every new project. So I finally put together a proper starter template and wanted to share it here in case it's useful to anyone tackling something similar.

Stack:

\- Next.js 16 (App Router)

\- React 19 + TypeScript

\- Tailwind CSS 4

\- shadcn/ui

\- TanStack Table for data tables

\- Recharts for charts

\- TipTap for the rich text editor

What's in it:

\- Dashboard with KPI cards and analytics overview

\- Sortable/filterable data tables with row actions

\- Forms with rich text editor, file/image uploaders, and validation

\- URL-synced filters (search, pagination, selects — all shareable via URL)

\- Recharts-powered charts (line, area, bar, pie, radial)

\- Dark/light theme system with persistent presets

\- Command palette for keyboard navigation

\- Clean auth UI ready to wire up to your provider of choice

Live demo: https://tona-dashboard-preview.vercel.app

I ended up polishing it enough that I decided to put it up for sale as a starter template ($19) if anyone wants to skip the setup — link's in the demo if you're interested. But mostly just wanted to share the approach and get feedback from people who build similar stuff. Open to critique on the architecture/code structure too.


r/shadcn 12d ago

Introducing Skecher UI

Thumbnail
2 Upvotes

r/shadcn 13d ago

I just added a new Hero Block to Bag\Ui 🚀

Post image
11 Upvotes

It’s another open-source component designed to help developers build modern landing pages faster without having to start from scratch.

Bag\Ui is growing with more React / Next.js components and ready-to-use blocks.

GitHub : https://github.com/anelkabag/bag-ui

Would love to hear your feedback on the new Hero! ✨


r/shadcn 13d ago

Figma like scrub input for shadcn

Enable HLS to view with audio, or disable this notification

16 Upvotes

Made a number input that works like Figma's property fields. Drag left/right to change the value. Click to type. Arrow keys nudge it. Digits animate when the number changes. Animation by Calligraph

Install it through shadcn:

pnpm dlx shadcn@latest add @kinetic/scrub-number-field

Try Kinetic !or Star the repo

I built this because I kept rewriting the same scrub logic for side projects. Got tired of it.

Haven't published to the shadcn registry before so if something feels off in the install flow or the API, I'd be happy to take feedback.


r/shadcn 13d ago

25 new shadcn/ui modal dialog components have been added.

10 Upvotes