Open source and free shadcn templates using Headless UI
7 templates • 7 contributors • Open source & free
7
Templates
7
Authors
Available Templates (7)

Eldora UI
Eldora UI is an open-source UI library designed for design engineers, offering a comprehensive collection of reusable components, blocks, and templates that can be easily copied and pasted into web applications. Built primarily with TypeScript (87.7% of the codebase), Next.js, React, Tailwind CSS, and Headless UI, the MIT-licensed library simplifies UI development by providing ready-to-use interface elements that maintain consistency and quality. The project features comprehensive documentation at eldoraui.site/docs and an active Discord community for support and collaboration. Eldora UI focuses on helping developers quickly integrate pre-built components into their projects without sacrificing customization flexibility, following a copy-paste approach where the code becomes yours to modify. With components ranging from basic UI elements to complex blocks and full templates, it provides building blocks for various application types. Perfect for design engineers and developers seeking high-quality, customizable components that accelerate development while maintaining professional design standards, Eldora UI bridges the gap between rapid development and polished user interfaces.

RetroUI
RetroUI is a retro-styled UI library for modern web applications that combines nostalgic design aesthetics with contemporary web development practices using Tailwind CSS. The MIT-licensed library provides playful, nostalgic design components that bring vintage computing and classic web design styles to modern applications while maintaining accessibility and responsive behavior. Built with TypeScript (71.3%), MDX (25.5%) for documentation, CSS for custom styling, Next.js, and Tailwind CSS, RetroUI offers developers a distinctive styling option beyond typical modern minimalist designs. The library is supported by Vercel's Open Source Program and provides components with retro visual characteristics like pixel-art borders, vintage color palettes, classic button styles, and nostalgic typography treatments. Perfect for portfolio sites wanting unique personality, gaming-related applications, creative agency websites, nostalgic product showcases, or any project seeking to stand out with a distinctive retro aesthetic while maintaining modern web standards, performance, and accessibility, RetroUI demonstrates how classic design can be reimagined for contemporary web applications.

Animate UI
Animate UI is a fully animated, open-source component library built with React, TypeScript, Tailwind CSS, and Framer Motion, providing customizable components with smooth animations and motion as core design principles. The MIT-licensed library offers installable and modifiable components through shadcn CLI, making it easy to browse, add, and customize animated components for web projects. Built with TypeScript (89.9% of codebase), React, Tailwind CSS, Radix UI primitives, and Framer Motion for animations, Animate UI emphasizes motion and animation throughout its component collection. The project welcomes contributions with a published Code of Conduct and has garnered significant community support with 2.6k stars and 16 contributors. Perfect for projects requiring animated interfaces, landing pages with engaging interactions, marketing websites, applications needing polished micro-interactions, or any project benefiting from professional animations without building custom animation logic, Animate UI provides production-ready animated components installable through familiar tooling and customizable to match any design system.

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.

Instagraph Next.js FastAPI
InstaGraph is an open-source knowledge graph generator inspired by Yohei Nakajima's Instagraph.ai that transforms unstructured text into interactive visual knowledge graphs using AI. Built with a Next.js frontend for the web interface, FastAPI backend for AI processing, React Flow for graph visualization, Tailwind CSS and Headless UI for styling, and OpenAI API for intelligent graph generation, this full-stack application demonstrates how to build AI-powered data visualization tools that make complex information easier to understand. The platform features automatic knowledge graph generation from user-provided text, interactive graph visualization with zoom, pan, and node manipulation, streaming and server-sent event endpoints for real-time updates, clean web interface for easy text input and graph viewing, and seamless integration between modern frontend and Python backend technologies. Users simply navigate to the application, input their text content, click submit, and watch as the AI analyzes relationships and concepts to generate a visual knowledge graph showing connections between ideas, entities, and topics. This visualization approach is invaluable for students and researchers organizing study materials and research notes, content creators mapping out article structures and topic relationships, product managers visualizing feature dependencies and user flows, educators creating visual learning aids from textual content, and anyone trying to understand complex information through visual connections. The project showcases how to architect full-stack AI applications with separate frontend and backend concerns, implement OpenAI integration for natural language understanding, build interactive data visualizations with React Flow, handle streaming responses for real-time feedback, and create intuitive interfaces for AI-powered tools. InstaGraph makes knowledge more accessible by transforming dense text into clear, visual representations of how concepts connect.

WordPress Plugin Boilerplate
The WordPress Plugin Boilerplate is a comprehensive starter template that brings modern web development practices to WordPress plugin development by integrating React, TypeScript, SASS, Tailwind CSS, shadcn/ui components, Vite for blazing-fast builds, Storybook for component development, and Hot Module Replacement for instant feedback during development. This boilerplate eliminates the traditional pain points of WordPress plugin development by providing a Laravel-inspired custom ORM for database operations, flexible API routing for REST endpoints, simplified shortcode generation with custom rendering, seamless data passing between PHP backend and React frontend, and a CLI tool for rapid plugin scaffolding and configuration. The development workflow is streamlined with npm run dev for full development mode with HMR, separate npm run dev:frontend and npm run dev:admin commands for focused development, npm run build to compile production-ready assets, and npm run release to create distributable plugin packages. The boilerplate includes Storybook integration for isolated component development and documentation, TypeScript for type safety across JavaScript code, SASS and Tailwind CSS for flexible styling options, shadcn/ui and Headless UI for accessible component primitives, and proper WordPress hooks and filters integration maintaining compatibility with the WordPress ecosystem. This template is invaluable for developers building commercial WordPress plugins with modern UIs and complex functionality, agencies developing multiple client plugins who need consistent, maintainable architecture, teams transitioning from jQuery-based WordPress development to React, freelancers who want professional development experience in WordPress projects, and anyone frustrated with traditional WordPress plugin development workflows. The project demonstrates how to integrate modern JavaScript frameworks into WordPress without fighting the platform, structure plugin code for maintainability and testability, implement database models and API routes in WordPress context, build component libraries with Storybook for WordPress admin interfaces, and accelerate WordPress plugin development with contemporary tooling.

GTD
GTD Task Management App implements the Getting Things Done methodology in a modern web application built with Next.js 13, NextAuth, shadcn/ui, and React Query. Designed for productivity enthusiasts who follow David Allen's GTD system, this app provides digital workflows for capturing, organizing, and executing tasks effectively. The application features inbox capture for quick task entry, project and context-based organization, next actions lists with priority management, and review workflows for weekly planning. Built with TypeScript for type safety, it leverages React Query for efficient data synchronization, NextAuth for secure user authentication, and shadcn/ui components for a clean, distraction-free interface. The app includes task filtering and search, recurring task support, due date management, and progress tracking across projects. Perfect for individuals and teams looking to implement GTD principles digitally with a modern tech stack that ensures reliable performance and seamless user experience.