Discover, generate, and publish Shadcn UI components. An open-source platform for UI inspiration and rapid development.
- Main Platform: https://shadway.online/
- AI Generator: https://shadway.online/component-generator
- Vibecode Gallery: https://shadway.online/vibecode
Stop hunting through scattered resources. Instead of wasting hours searching for Shadcn UI components, examples, and templates across different platforms, Shadway brings everything to one place.
- Component Library - Curated registry of production-ready Shadcn UI components organized by category
- AI Generator - Describe UI in plain English, get production-ready code instantly
- Vibecode Gallery - Discover and fork community-built components
- Templates - Premium and free website templates
- Submit - Share your Shadcn UI projects with the community
- Dark/Light Mode - Seamless theme switching
- Responsive Design - Works perfectly on all devices
- Next.js 15 - React framework with App Router
- TypeScript - Type-safe development
- Tailwind CSS v4 - Utility-first CSS framework
- Shadcn UI - High-quality UI components
- Framer Motion - Smooth animations
- Lucide React - Beautiful icons
- Sandpack - Live code preview for component generation
- MongoDB - NoSQL database
- NextAuth.js - Authentication
- Vercel - Hosting platform
- ESLint - Code linting
- Prettier - Code formatting
shadway/
├── app/ # Next.js App Router
│ ├── page.tsx # Homepage with component gallery
│ ├── docs/ # Component documentation
│ ├── component-generator/ # AI component generator
│ ├── vibecode/ # Community vibecode gallery
│ ├── template/ # Template marketplace
│ ├── submit/ # Project submission
│ ├── admin/ # Admin dashboard
│ └── api/ # API routes
├── components/ # Reusable components
│ ├── ui/ # Shadcn UI components
│ ├── landing/ # Landing page components
│ └── site-components/ # Custom site components
├── lib/ # Utilities and configs
├── hooks/ # Custom React hooks
└── registry/ # Component registry data
- Node.js 24+ and npm
- MongoDB database
- Environment variables configured
-
Clone the repository
git clone https://github.com/moazamtech/shadway.git cd shadway -
Install dependencies
npm install
-
Set up environment variables
cp .env.example .env.local
Configure your
.env.local:MONGODB_URI=your_mongodb_connection_string NEXTAUTH_SECRET=your_nextauth_secret NEXTAUTH_URL=http://localhost:3000
-
Run the development server
npm run dev
-
Open http://localhost:3000 in your browser
Browse curated registry blocks across multiple categories including:
- Hero sections
- Feature grids
- Call-to-action blocks
- Contact sections
- About sections
- Testimonials
- Footers
- And more...
Each component can be installed with a single command.
Describe the UI you want to build in plain language. The AI generates production-ready components with:
- Prompt - Describe your UI in natural language
- Generate - Get runnable code and live preview
- Edit - Adjust files directly with Monaco editor
- Publish - Share with the community
Discover community-built components. Fork, customize, and ship to production.
Browse premium and free website templates built with Shadcn UI.
Share your Shadcn UI project with the community for review and potential featuring.
Manage content, user submissions, templates, and view analytics.
We welcome contributions:
- Submit your project - Share your Shadcn UI website
- Report bugs - Help us improve
- Suggest features - Share your ideas
- Code contributions - Submit pull requests
- Follow TypeScript best practices
- Use Shadcn UI components when possible
- Maintain responsive design principles
- Write clean, documented code
This project is licensed under the MIT License - see the LICENSE file for details.
- Website: https://shadway.online/
- Twitter: @loxtmozzi
- GitHub: https://github.com/moazamtech/shadway
Made with care by Moazam Butt
Star this repo if you find it helpful!