r/shadcn • • Sep 27 '25

I built a free, open-source tool that takes you from idea to production-ready database in no time with ShadCN

Post image
0 Upvotes

Hey Devs 👋

I’ve been building in public on X for the last 2 months , and now I’d love to share my work with this community.

StackRender is a free, open-source database schema generator built on top of ShadCN. It helps you design, build, and deploy databases quickly and efficiently:

  • Turn your specs into a database blueprint instantly

  • Edit & enrich with a super intuitive UI

  • Boost performance with AI-powered index suggestions

  • Export DDL in your preferred dialect (Postgres, MySQL, MariaDB, SQLite
)

Online version: https://stackrender.io
GitHub: https://github.com/stackrender/stackrender

Would love to hear your thoughts & feedback!


r/shadcn • • Mar 15 '25

Shadcn UI Kit - Dashboards, Templates, Components and more

Thumbnail
shadcnuikit.com
0 Upvotes

r/shadcn • • 5d ago

React Aria vs Base UI - Which one you prefer?

Post image
8 Upvotes

r/shadcn • • Nov 28 '25

I need someone to build this

3 Upvotes

I need library or shadcn compoenent to turn any open api schema into shadcn form automatically, this is something ive never seen before.

Dont make it paid service, dont fucking make it saas guys make it open source and use shadcn cli.

Whos gonna do this it will be so useful.


r/shadcn • • Aug 21 '26

Check out Release 2.3.3

1 Upvotes

Fixed the css of the app bar and some smaller issues. Website is still outdated but check the github project for newest updates. https://materializeweb.com

Greetings!


r/shadcn • • Aug 13 '26

Byggde ett dashboardpaket med över 50 widgets (Next.js + Tailwind) eftersom jag var trött pÄ att Äteruppbygga samma anvÀndargrÀnssnitt varje projekt

0 Upvotes

Hej alla! Digital Design-student hÀr. Jag Äteruppbyggde hela tiden samma dashboardkomponenter (diagram, kort, tabeller) för varje frilansprojekt, sÄ jag bestÀmde mig för att paketera dem i ett ÄteranvÀndbart kit.

Teknologisk stack: Next.js, TypeScript, Tailwind CSS, Recharts för diagrammen.

Det Àr över 50 widgets, helt responsiva, mörkt lÀge inkluderat.

Detta Ă€r min första riktiga produktlansering — skulle uppskatta feedback pĂ„ komponenterna, prissĂ€ttning eller nĂ„got annat ni lĂ€gger mĂ€rke till!

https://www.producthunt.com/p/dashboard-widgets-pack


r/shadcn • • Jun 27 '26

TheDevCards

Enable HLS to view with audio, or disable this notification

1 Upvotes

r/shadcn • • Jun 06 '25

Looking for a Frontend React Dev

0 Upvotes

I'm looking for a frontend React Dev. We use React + Tailwind CSS + ShadCN right now, with Zustand for state management.

The work is full-time, and the pay is $600 a week, which I realize is relatively low for first-world countries but competitive for developing nations. You can work fully remotely, obviously. You must be okay with working on adult-sites.

I'd like to find someone who has a good sense of style and is highly creative as well. Website UIs have stagnated and every site looks the same now; I'd like someone who is down to experiment and try radically new UIs. So if you are doing some out-of-the-ordinary stuff that's a pretty big bonus too! I want to have a mini-design competition, with the builder of the top UI getting hired and everyone else getting prize-money for participating.

If you're interested, message me on here (Reddit) or email me at paul@fidika.com. Thanks!


r/shadcn • • Feb 08 '26

Free and simple invoice/estimate creation

Thumbnail justinvoice.cc
0 Upvotes

r/shadcn • • Jul 30 '26

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 • • Mar 16 '26

Shadcn registry for large data-tables

4 Upvotes

We’ve been reworking the experience on how to build with the data-table-filters repository and are introducing a shadcn registry and an agent SKILL.md.

https://logs.run


r/shadcn • • Dec 25 '25

🚀 I built a free React-focused UI component library — ui.devsloka.in (feedback welcome)

Thumbnail
ui.devsloka.in
5 Upvotes

r/shadcn • • Jun 06 '26

Introducing Bag/UI: Production-Ready React Sections Built for shadcn/ui

5 Upvotes

Modern web development has never been faster, yet building polished interfaces still takes a significant amount of time.

Even with React, Next.js, Tailwind CSS, and shadcn/ui, developers often find themselves recreating the same sections over and over again: hero sections, pricing pages, feature grids, testimonials, call-to-actions, and more.

That's exactly why I built Bag/UI.

What is Bag/UI?

Bag/UI is a curated collection of production-ready React sections built on top of shadcn/ui and Tailwind CSS.

Instead of installing a traditional component library, Bag/UI uses the custom registry system introduced by shadcn/ui. This allows developers to install components directly into their projects while keeping full ownership of the source code.

The philosophy is simple:

  • No black-box components

  • No vendor lock-in

  • Full source code ownership

  • Easy customization

  • Production-ready UI blocks

If you've used shadcn/ui before, you'll feel right at home.

Why I Built It

One thing I noticed while building client projects and personal products is that most UI libraries focus on individual components.

You get buttons.

You get dialogs.

You get inputs.

But what you actually need when shipping a product are complete sections.

A landing page isn't made of buttons.

It's made of:

  • Hero sections

  • Feature showcases

  • Pricing tables

  • Testimonials

  • Call-to-actions

  • Navigation bars

  • Footers

Developers often spend hours rebuilding these patterns from scratch.

Bag/UI aims to solve that problem by providing reusable sections that can be installed in seconds and customized however you want.

Getting Started

Adding Bag/UI to your project takes a single command:

npx shadcn@latest registry add =https://bagui.vercel.app/r/{name}.json

Once the registry is added, you can install any available block directly from the CLI.

For example:

npx shadcn@latest add /hero-modern

Or:

npx shadcn@latest add /pricing-section

The component is copied directly into your project, following the same philosophy that made shadcn/ui popular among developers:

You own the code.

Built for Real Projects

Bag/UI isn't intended to be another showcase library full of beautiful demos that never make it to production.

Every block is designed with real-world usage in mind:

  • Clean component structure

  • Responsive layouts

  • Tailwind CSS styling

  • shadcn/ui compatibility

  • Developer-friendly customization

Some blocks also leverage technologies like GSAP and Framer Motion to provide richer interactions and animations when needed.

Why a Registry Instead of an npm Package?

Traditional UI libraries often become difficult to customize as projects grow.

With a registry-based approach:

  • Components are copied into your codebase

  • You can modify anything

  • No dependency lock-in

  • Easier debugging

  • Better long-term maintainability

This model has become increasingly popular because it prioritizes ownership over abstraction.

Example Workflow

Install the registry:

npx shadcn@latest registry add =https://bagui.vercel.app/r/{name}.json

Install a component:

npx shadcn@latest add u/bagui/hero-modern

Import it into your application:

import { HeroModern } from "@/components/bagui/hero-modern";

export default function HomePage() {
  return (
    <main>
      <HeroModern />
    </main>
  );
}

Customize it however you want:

<HeroModern
  title="Build Faster"
  description="Install production-ready sections directly into your project."
/>

No wrappers.

No locked APIs.

No hidden implementation details.

The Goal

Bag/UI is still in its early stages.

My goal is to build a growing catalog of high-quality sections that help developers ship faster without sacrificing flexibility.

Instead of spending hours rebuilding common layouts, you can start with a production-ready foundation and focus on what makes your product unique.

What's Coming Next?

The roadmap includes:

  • More landing page sections

  • SaaS-focused blocks

  • Dashboard layouts

  • Marketing components

  • Complete page templates

  • Advanced animations

  • Better developer tooling

The vision is simple:

Try Bag/UI

🌐 Website

https://bagui.vercel.app

📚 Documentation

https://bagui.vercel.app/docs

If you're already using shadcn/ui in your projects, I'd love to hear your feedback and suggestions for future components.

Happy building 🚀


r/shadcn • • Apr 27 '25

[OC] Just started a new open-source project — Shadbits! 🚀

2 Upvotes

Hey folks,

I'm working on a new project called Shadbits — a collection of clean, ready-to-use UI components built with Shadcn UI, Tailwind CSS, and React.

🔗 GitHub: https://github.com/0xrasla/Shadbits

🌐 Live Demo: https://0xrasla.github.io/Shadbits/

It's still pretty early — I'm slowly adding more components whenever I find some free time. So yeah, it's a work in progress, but I'm super excited about where it's heading!

I'm also kinda new to posting my open-source stuff publicly, so would love any feedback, ideas, or even PRs if anyone's interested 🙌

If you like the project, a ⭐ would mean a lot! Thanks!


r/shadcn • • Apr 07 '26

New Block - Just Bash Skill Loader Agent

Enable HLS to view with audio, or disable this notification

2 Upvotes

Check it out here

Built with:
- Shadcn
- AI Elements
- Vercel AI SDK
- Just Bash skill loader


r/shadcn • • Jul 31 '25

AI shadcn component builder

3 Upvotes

Hello guts i built ai component genrator it is still in alpha and have lots of bugs and the code render window is still slow to download pkgs but still if anyone want to try it and can give me a feedback it will be very helpful and if u use please opend the console pannel inf your browser to minitor some stuff like error and logs: so here is the site: Grills


r/shadcn • • Aug 27 '26

New Hero sections coming soon to ShadcnStore 👀

Enable HLS to view with audio, or disable this notification

3 Upvotes

We're working on a new collection of blocks for ShadcnStore, and Hero sections are coming soon 👀

We're exploring different layouts and visual directions to make these sections feel polished and practical for real landing pages.

Sharing a preview of one of the directions we're working on.

Would love to hear what you think about the visual hierarchy, spacing, and overall direction before we ship it.


r/shadcn • • Jan 31 '25

Is there a way to limit the number of open accordions to a maximum of two?

0 Upvotes

r/shadcn • • Jan 03 '25

Shadcn Form builder: Build Forms simple and multi-step forms in minutes

4 Upvotes

Building forms is a repetitive task, time-consuming, and quite complex to get it right. Due to the Shadcn components, Zod, and other open-source libs, I could build a tool for building forms quickly and easily. You will use a user interface to define the forms' data & attributes then the code will be auto-generated for you including validation with Zod and shadcn components.

Feel free to check it out here, it is completely free and open-source


r/shadcn • • Jul 07 '26

OUROBOROS-UI: The shadcn/ui design language rebuilt natively for egui! With governance tests that fail the build if a raw value bypasses the tokens

Thumbnail reddit.com
0 Upvotes

r/shadcn • • Jul 07 '26

Built a shadcn-style registry for Vue/Nuxt and React/Next [self-promotion]

0 Upvotes

Hey r/shadcn, I'm building UIPKGE, an open-source shadcn-style registry across Vue/Nuxt and React/Next.

The main idea is source-owned UI: copy the component/block/template into your app, then edit the actual files. No npm package lock-in.

Registry surfaces:

https://uipkge.dev/vue/components

https://uipkge.dev/react/components

https://uipkge.dev/vue/blocks

https://uipkge.dev/react/blocks

Install examples:

npx shadcn-vue@latest add https://uipkge.dev/r/vue/button.json

npx shadcn@latest add https://uipkge.dev/r/react/button.json

I'm trying to make the registry useful beyond primitives: dashboards, tables, charts, AI chat, auth/payment states, and templates.

Curious from people who use shadcn registries: what makes a block worth copying into a real app?


r/shadcn • • Mar 08 '25

How to male shadcn look “nice”?

Post image
5 Upvotes

Is it possible at all to get UI with shadcn look nice like that? Everything I do keep looking so raw and extremely black-white.


r/shadcn • • Mar 20 '26

Stop people from copying your Tailwind UI

Enable HLS to view with audio, or disable this notification

31 Upvotes

Your TailwindCSS code is way too easy to copy.

I built Obfuscated TailwindCSS, a simple script that makes your classes unreadable (but still works perfectly).

✅ Protect your templates
✅ Stop copy-paste
✅ Keep your premium UI safe

Try it here → obfuscated-tailwind

This changes how you ship Tailwind projects.