Open source and free shadcn templates using Full-stack
46 templates • 43 contributors • Open source & free
46
Templates
43
Authors
Available Templates (46)

React Tanstarter
React Tanstarter is a minimal starter template for TanStack Start featuring React 19 with React Compiler, Better Auth for authentication, Drizzle ORM with PostgreSQL, and shadcn/ui components for rapid full-stack application development. The public domain-licensed template provides an integrated authentication system through Better Auth, database management with Drizzle ORM, routing and state management with TanStack Router and Query, and beautiful UI components from shadcn/ui styled with Tailwind CSS. Built with cutting-edge technologies including React 19's latest features, TanStack's modern routing and data fetching tools, and PostgreSQL for robust data persistence, the template offers a minimalist project structure with integrated development scripts and easy deployment to platforms like Netlify. The starter includes utilities for authentication flows, theming customization, and efficient development workflows with all essential features configured. Perfect for developers building full-stack React applications with TanStack, projects requiring modern authentication and database integration, teams wanting rapid project initialization with latest React ecosystem practices, or any application benefiting from TanStack's powerful routing and data management combined with production-ready authentication and database tooling.

Cella
Cella is a narrow stack TypeScript template for building collaborative web applications with built-in sync engine, offline capabilities, and real-time synchronization. The MIT-licensed template combines PostgreSQL database, Hono web framework, Drizzle ORM, Electric-sync for real-time sync, React, TanStack Router, and shadcn/ui components into a comprehensive starter for reactive applications. Built with TypeScript (97.3% of codebase), Node.js, and Docker support, Cella provides easy CLI-based project initialization with prebuilt authentication and data access systems ready for testing. The template emphasizes developer experience with modern web technologies while offering offline-first architecture and collaborative features out of the box. Perfect for building collaborative tools, team applications with real-time updates, offline-capable web apps, or any project requiring synchronized data across multiple users and devices, Cella demonstrates how to combine modern sync engines with traditional web stacks for applications that work seamlessly online and offline while maintaining data consistency.

Next Auth Roles Template
Next Auth Roles Template is a comprehensive Next.js 14 starter with built-in authentication, user role management, and admin panel functionality powered by Auth.js v5, Prisma, and shadcn/ui. This opinionated template provides everything needed to build modern web applications with sophisticated access control: multiple authentication providers (Google, Twitter, GitHub), serverless PostgreSQL with Neon, React Email integration, Vercel Analytics, and a modular architecture that allows developers to remove unnecessary features via CLI commands. The template includes TypeScript for type safety, Tailwind CSS for styling, and high-quality code organization that reduces initial setup time from days to minutes. Perfect for SaaS applications requiring user management, multi-tenant platforms with role-based permissions, admin dashboards with secure access control, or any web application where authentication and authorization complexity would otherwise slow development velocity. The template's unique one-command content removal feature lets teams customize the starting point by eliminating blog or documentation sections they don't need, ensuring a clean codebase tailored to specific project requirements while maintaining all the authentication and authorization infrastructure essential for production applications.

OpenBio
OpenBio is an open-source link-in-bio page builder that enables users to create beautiful, customizable personal landing pages for consolidating their online presence across multiple platforms. Built with Next.js, TypeScript, React, Tailwind CSS, Drizzle ORM, and leveraging serverless architecture with edge computing, this modern platform provides an alternative to proprietary services like Linktree with complete data ownership and customization freedom. The application uses Clerk for authentication, Upstash for data storage, tRPC for type-safe APIs, and supports server components for optimal performance. Perfect for content creators managing multiple social platforms, influencers needing a centralized hub for audience engagement, professionals showcasing work across various channels, or anyone seeking to replace subscription-based link-in-bio services with a self-hosted solution. As a community-driven project, OpenBio welcomes contributions and provides developers with the flexibility to customize every aspect of their link pages while maintaining a simple, accessible setup process that requires Node.js 18+ and pnpm 8+, making it easy to deploy and host on your own infrastructure or preferred hosting platform.

AI LLM Comparison
AI LLM Comparison is a comprehensive, open-source web application built with Next.js 14, TypeScript, Tailwind CSS, Radix UI, and integrated with Vercel Analytics and PostHog, designed to help users compare AI language models across different providers in one centralized platform. This invaluable resource provides price comparison across major AI providers (OpenAI, Anthropic, Google, Meta, Cohere), an interactive pricing calculator for cost estimation, side-by-side model comparisons highlighting capabilities and limitations, real-time data updates sourced from BerriAI's LiteLLM for accuracy, responsive design for all devices, and completely free access without registration requirements. The platform addresses the growing challenge of AI model selection as the LLM landscape becomes increasingly complex with diverse pricing models, capability differences, and provider-specific features. Perfect for developers choosing models for production applications, businesses evaluating AI implementation costs, researchers comparing model capabilities for academic work, or students learning about LLM options and pricing structures. By aggregating accurate, up-to-date information from trusted sources and presenting it through an intuitive comparison interface, this tool eliminates the time-consuming process of visiting multiple provider websites and reconciling different pricing structures, enabling informed decisions about AI model selection based on transparent data rather than marketing materials.

Next Prisma Tailwind Ecommerce
Next Prisma Tailwind Ecommerce is an open-source, full-stack e-commerce platform built with TypeScript, Next.js 14 App Router with React Server Components, Prisma ORM, Tailwind CSS, Radix UI, shadcn/ui, and Zod validation, providing both a customer-facing storefront and a comprehensive admin panel for complete store management. This enterprise-grade solution features custom dynamic sitemap generation for SEO, admin dashboard for managing products, orders, and payments, file uploads with next-cloudinary integration, JWT authentication with httpOnly cookies for security, storefront with integrated blog powered by MDX, email verification and invoice generation, metadata handling for SEO optimization, and internationalization support for global markets. The monorepo architecture separates the admin and storefront applications, allowing independent scaling and deployment to Vercel, Netlify, or Docker environments. Perfect for businesses launching online stores with full control over the stack, developers building custom e-commerce solutions for clients, startups requiring rapid deployment without merchant lock-in, or any project where combining content marketing (blog) with product sales creates competitive advantages. The separation of admin and storefront concerns enables teams to work independently on customer experience and operational tools, while the MDX-powered blog system allows non-technical team members to create SEO-optimized content that drives organic traffic and customer engagement.

rdt.li
rdt.li is a self-hostable, feature-rich, minimalistic URL shortener built with Next.js 14, Auth.js (NextAuth), Drizzle ORM, and serverless Postgres on Neon, providing comprehensive analytics and modern UX without page reloads. This sleek platform offers all-time, daily, and unique view analytics with bar charts visualizing the last 7 days of traffic, editable URL titles and destinations for flexible link management, filtering and search capabilities for large link collections, and light/dark mode themes for user preference. Built on the "Onset" Next.js starter, the application is designed for easy customization by both beginners and experts while maintaining production-ready quality and performance. Perfect for marketing teams tracking campaign link performance, developers needing custom short URLs for projects, businesses wanting link analytics without third-party service dependencies, or content creators managing numerous links across platforms where analytics inform content strategy. Deployed on Vercel with Neon's serverless PostgreSQL, the architecture scales automatically with traffic while minimizing costs during quiet periods. The no-page-reload experience provides instant feedback on user actions, creating a native-app-like experience in the browser. As an open-source project under MIT license, rdt.li enables complete control over link data and analytics, addressing privacy concerns and vendor lock-in issues inherent in commercial URL shortening services.

Iotawise
Iotawise is an open-source habit tracking application built with Next.js App Directory, TypeScript, Tailwind CSS, shadcn/ui, NextAuth.js, Prisma ORM, Zod validations, and Neon PostgreSQL, designed to help users monitor and improve daily habits and activities with minimal complexity and maximum insight. This streamlined platform provides a user-friendly interface for daily habit logging, activity streak monitoring to maintain motivation, dashboard analytics visualizing progress and patterns, Google Authentication for quick onboarding, planned web push notifications for habit reminders, and cross-platform PWA support for native-like experiences on mobile and desktop. The application emphasizes simplicity and ease of use, removing barriers that cause users to abandon more complex habit-tracking systems while still providing enough analytics to maintain motivation and identify improvement opportunities. Perfect for individuals building positive routines and breaking negative habits, productivity enthusiasts tracking multiple areas of life improvement, health and fitness goals requiring daily consistency, or anyone seeking behavior change where streak visualization and progress tracking provide the psychological reinforcement needed for long-term habit formation. The combination of NextAuth.js for authentication, Prisma for type-safe database access, and Zod for runtime validation creates a robust, maintainable codebase, while the planned PWA support will enable offline habit logging and push notifications that keep users engaged with their goals throughout the day.

Firestarta
Firestarta is a comprehensive Next.js SaaS boilerplate built with TypeScript, NextAuth for authentication, Prisma ORM, Supabase Postgres, Lemon Squeezy for subscription management, Sass, shadcn/ui, and Lucide icons, designed to provide a robust starting point for web applications requiring user authentication, subscription payments, and modern development practices. This production-ready template features App directory structure with Route Groups, Intercepting and Parallel Routes, server-side and client-side rendering for optimal performance, comprehensive user authentication flows, integrated subscription management with Lemon Squeezy, responsive design across all devices, internationalization support for global markets, and custom components following best practices. Built with modern web development standards and a flexible, extensible architecture, Firestarta eliminates weeks of initial setup work that every SaaS application requires before addressing unique product features. Perfect for developers building subscription-based products, entrepreneurs launching SaaS businesses with limited technical teams, agencies delivering custom SaaS solutions for clients, or any project where rapid development without sacrificing code quality and scalability determines market success. The integration of NextAuth, Prisma, and Supabase provides a complete authentication and data management stack, while Lemon Squeezy handles the complexity of subscription billing, tax compliance, and payment processing, enabling founders to focus on product differentiation and customer acquisition rather than infrastructure and payment integration challenges.

AI Fusion Kit
AI Fusion Kit is a comprehensive, production-ready AI web application template that accelerates the development of modern AI-powered applications with Next.js 14, React, TypeScript, and shadcn/ui. Built on the App Router architecture, this feature-rich template integrates Supabase for authentication and database management, OpenAI for AI capabilities, and Stripe for payment processing, providing a complete foundation for building SaaS products with AI features. The template includes pre-built AI chat interfaces with streaming responses, user authentication and profile management, subscription and billing integration, responsive UI components following shadcn/ui design patterns, database schema with Supabase migrations, middleware for protected routes, and webhook handlers for Stripe events. The modular architecture allows developers to customize AI models, swap authentication providers, adjust pricing tiers, and extend the component library while maintaining type safety throughout. Use cases include launching AI chatbot applications with subscription monetization, building AI writing assistants or content generation tools, creating customer support platforms with AI-powered responses, and developing AI research or experimentation interfaces. The template significantly reduces development time by providing battle-tested patterns for authentication, payments, AI integration, and database management, allowing teams to focus on unique product features rather than boilerplate setup.

Luro AI
Luro AI is a stunning, modern social media marketing platform landing page that showcases next-generation SaaS design with AI-powered features for streamlining social media management. Built with Next.js, TypeScript, Tailwind CSS, and a combination of premium UI libraries including shadcn/ui, Magic UI, and Aceternity UI, this project demonstrates how to create visually impressive marketing websites with smooth animations, interactive components, and professional design patterns. The platform features real-time social media performance tracking across multiple channels, engagement rate calculations and analytics visualization using Recharts, audience growth insights with trend analysis, custom report generation for stakeholder presentations, ROI tracking and analysis for marketing campaigns, and comprehensive data visualization capabilities powered by React charts. The tech stack includes Prisma ORM with MongoDB for flexible data modeling, Clerk authentication for user management, React Hook Form for validated input handling, and Framer Motion for fluid animations and micro-interactions that enhance user experience. The design emphasizes clean layouts with strategic use of whitespace, glassmorphism effects and modern gradient backgrounds, responsive components that adapt beautifully to all screen sizes, and accessibility-first patterns ensuring inclusive user experiences. This project is perfect for developers building SaaS marketing pages that need to impress investors and customers, learning how to combine multiple UI libraries cohesively, studying modern design trends in AI and analytics platforms, creating portfolio pieces that demonstrate frontend expertise, and understanding how to implement complex data visualizations in React. Luro AI serves as an excellent reference for contemporary SaaS landing page design, showing how to balance aesthetics with functionality.

Frontend Nav
Frontend Nav is a curated navigation website designed to collect, organize, and showcase high-quality frontend development resources from both domestic and international sources, making it easy for developers to discover essential tools, libraries, tutorials, and communities. Built with Next.js 13, TypeScript, Radix UI components, Tailwind CSS, NextAuth.js for authentication, Prisma ORM with MySQL on PlanetScale, and Puppeteer for automated screenshot generation, this project demonstrates modern web application development while solving a real problem: the overwhelming fragmentation of frontend resources across the internet. The platform features automated webpage information capture using Puppeteer to extract metadata, titles, and descriptions, shareable website cards with screenshots for visual recognition, user authentication allowing developers to save their personal collections, organized categorization of resources by topic, framework, or use case, dark mode support for comfortable browsing in different environments, and one-click deployment to Vercel for easy hosting. Inspired by the Taxonomy project, Frontend Nav emphasizes clean data presentation, intuitive navigation, and rapid resource discovery. The application uses MySQL hosted on PlanetScale for scalable database management, Prisma for type-safe database queries, and NextAuth.js for flexible authentication supporting multiple providers. This project is valuable for developers building resource directories or curated link collections, learning modern full-stack Next.js development patterns, studying how to implement web scraping with Puppeteer for metadata extraction, creating personal knowledge bases or bookmark managers, and understanding how to build CRUD applications with authentication and database integration. Frontend Nav serves both as a practical tool for organizing frontend resources and as an educational codebase demonstrating production-ready Next.js architecture.