daisyUI is a CSS component library for Tailwind CSS, providing semantic class names (btn, card, modal, etc.) that abstract low-level utility classes for rapid UI development. The repository is a monorepo containing the core library (packages/daisyui), a comprehensive documentation site built with SvelteKit (packages/docs), a playground for testing, and tooling for build automation and AI integration. The library is framework-agnostic, using pure CSS with modern features like @layer, CSS custom properties, and OKLCH color space. It ships 60+ component families and 35+ built-in themes, all configurable via CSS variables. The documentation site includes interactive component demos, install guides for 20+ frameworks, i18n support, and a theme generator. The project has a strong AI/LLM integration layer with structured skill files, MCP servers, and plugins for coding agents (Claude, Codex, Cursor, etc.).
react-bits is a comprehensive open-source library of animated, interactive React components, accompanied by a full documentation and demo site. The repository contains hundreds of self-contained components spanning text animations, background effects, UI micro-interactions, and complete widgets, each offered in four variants (JavaScript/TypeScript × CSS/Tailwind) and distributed via a custom jsrepo registry that allows direct code copying or CLI installation (shadcn/jsrepo). The architecture is a hybrid of a component distribution platform and a marketing/demo site: `src/content`, `src/tailwind`, `src/ts-default`, and `src/ts-tailwind` contain the actual component sources, while `src/demo` and `src/components` host a Chakra UI–based playground with live prop editing, code previews, prop tables, and dependency listings. The project heavily leverages modern animation and WebGL libraries — GSAP, Framer Motion (motion/react), OGL, Three.js, and Matter.js — with many components implementing custom shaders, physics simulations, and gesture handling. While the codebase exhibits strong craftsmanship in individual components (clean hooks, accessibility attributes, cleanup of WebGL contexts, reduced-motion support), it suffers from notable duplication across the four variant directories, which risks behavioral drift and increases maintenance burden. Despite this, the library is actively maintained, well-documented, and genuinely reusable, making it a valuable resource for front-end developers seeking production-ready animated UI patterns.
This repository is a monorepo React UI component library consisting of two main packages: `smarthr-ui` (core UI components) and `@smarthr/smarthr-ui-charts` (charting components). It provides a comprehensive set of accessible, internationalizable UI components built with TypeScript, Tailwind CSS, and modern React patterns. The library emphasizes accessibility, theming, and developer experience, with extensive testing (unit, visual regression, E2E) and Storybook documentation. Key architectural features include a design token system, custom hooks for common patterns (useLatest, usePortal), and a focus on composability.
dembrandt is a production-grade design token extraction tool that analyzes live websites via headless Chromium (Playwright) and produces structured outputs including colors, typography, spacing, components, shadows, motion, and gradients. It supports multiple export formats: W3C DTCG tokens, Tailwind CSS v4 themes, DESIGN.md, self-contained HTML reports, PDF brand guides, and terminal display. Beyond extraction, it offers drift detection (comparing extractions over time with a 0–100 score), a GitHub Action for CI gates, and an MCP server for AI agent integration (Claude, Cursor). The architecture is modular with fault-isolated extractors, a pure-function drift engine, and a generic async job queue. While primarily an application, it includes an optional ONNX ML model for brand primary color prediction and advanced color science (OKLab, CIEDE2000, gamut mapping), giving it a hybrid character. The codebase demonstrates strong engineering practices: extensive test coverage, CI/CD pipelines, lazy browser loading, and graceful degradation across all output formatters.
Fuwari is a static blog template built with Astro and Tailwind CSS. It generates static HTML from Markdown content with features like light/dark mode, Pagefind-based search, responsive design, and customizable themes. The architecture uses Astro's component-based system with Svelte for interactive elements, Swup for page transitions, and Expressive Code for enhanced code blocks. Content is sourced from Markdown files in src/content/ and processed at build time to generate static assets. Key entry points include page routing files (.astro) and API routes for RSS/robots.txt. The template demonstrates strong engineering practices in its modular component design, effective use of Astro's content collections, and thoughtful implementation of UI interactions.
Intent UI is a copy-paste accessible React component library built on React Aria Components and styled with Tailwind CSS v4. It follows the shadcn/ui distribution model: components are installed via CLI (`npx shadcn@latest add @intentui/<component>`) from a registry served by the included Next.js documentation site. The repository contains over 80 UI components (buttons, forms, overlays, charts, navigation, layouts, etc.), each with multiple usage examples and comprehensive MDX documentation. The architecture is a Next.js App Router application that also functions as the component registry host, with custom build scripts generating registry JSON, icon metadata, and LLM-friendly documentation exports. External dependencies include React Aria Components for accessibility, Recharts for charts, motion for animations, sonner for toasts, and tailwind-variants for styling variants. The library is monetized through sponsor tiers and premium design assets, but the core components are MIT-licensed.
Plex Rewind is a Next.js web application that provides a personalized year-in-review (Rewind), a real-time activity monitor, and a configurable dashboard for Plex media servers. It ingests data from Tautulli (play history, library stats), Overseerr (content requests), and TMDB (posters, ratings), and authenticates users via Plex OAuth through NextAuth. The architecture is a monolith with server-side rendering, API routes, and a middleware layer that enforces setup requirements and access control. Settings are persisted to a local JSON file. The application supports PWA installation, multi-language i18n (English, Estonian, French, German), and is fully containerized with Docker. The codebase demonstrates strong engineering practices: strict TypeScript, server actions for form handling, React Server Components, motion animations, and a well-organized component hierarchy. It is actively maintained with semantic release automation and CI/CD pipelines.
Open Video Downloader (formerly youtube-dl-gui) is a cross-platform desktop GUI for downloading videos and audio from YouTube and over 1000 other websites, using yt-dlp as its core engine. It provides a queue-based download workflow with features including format/codec selection, subtitle management, SponsorBlock integration, authentication (cookies, tokens, passwords), input filtering (date, size, match filters), and extensive output customization (containers, filename templates, directory organization). The application also manages automatic updates of both itself and its helper binaries (yt-dlp, ffmpeg, ffprobe, deno, AtomicParsley) via a signed manifest. The architecture is a Tauri 2 application with a Rust backend and Vue 3 frontend. The Rust backend handles yt-dlp process management, output parsing (progress, errors, metadata), binary updates, configuration persistence, and concurrent download scheduling. The frontend uses Pinia stores for state management, Vue Router for navigation, and composables for reusable logic. Communication between frontend and backend occurs through Tauri IPC commands and events, with a well-defined command structure in Rust and corresponding listener plugins in TypeScript. Key entry points include src/main.ts (Vue app bootstrap), src-tauri/src/main.rs (Rust entry), src/router.ts (route definitions), and src/plugins/tauriListeners.ts (event listener registration). The primary data flow begins when a user adds a URL: the frontend sends an IPC command to the backend, which runs yt-dlp to fetch metadata, parses the JSON output into structured models, and returns the data to the frontend. The user then configures download options, and the backend spawns a yt-dlp download process, streaming progress events back to the frontend for real-time UI updates. External dependencies include yt-dlp, ffmpeg, ffprobe, deno, AtomicParsley, the SponsorBlock API, system keyring (via Tauri stronghold), and Sentry for error reporting.
Flowbite is a production-grade UI component library built on top of Tailwind CSS. It provides a comprehensive set of interactive, accessible components (modals, dropdowns, tooltips, carousels, datepickers, etc.) that are initialized via HTML data attributes and backed by a lightweight JavaScript runtime. The library is distributed as an npm package with multiple entry points (ESM, CJS, UMD, Turbo, Phoenix) and includes a Tailwind CSS plugin that injects base styles for forms, tooltips, charts, and third-party integrations. The repository also hosts an extensive Hugo-based documentation site with live examples, framework integration guides (React, Vue, Angular, Laravel, Django, etc.), and a theming system with five pre-built themes (default, minimal, enterprise, playful, mono). The architecture follows a consistent component pattern: each component is a class with `init()`, `destroy()`, and static `init*()` methods that scan the DOM for data attributes. A global `Instances` singleton manages all component instances by ID, supporting override and random ID generation. The library uses Popper.js for positioning dropdowns, tooltips, and popovers, and relies on an external `flowbite-datepicker` for datepicker functionality. The Tailwind plugin (`plugin.js`) uses `plugin.withOptions` to conditionally add base styles and component classes, and the CSS theming system leverages CSS custom properties for colors, fonts, radii, and shadows with dark mode support. While the library is well-structured and actively maintained, its large surface area (30+ components) and extensive documentation create maintenance overhead. The integration guides for 20+ frameworks are prone to drift, and the inline SVG icons and hardcoded Tailwind classes in documentation examples require careful version alignment. The codebase demonstrates solid engineering practices with TypeScript, Webpack builds, and consistent patterns, making it a reliable choice for projects needing a Tailwind CSS component library with JavaScript interactivity.
This repository is a modern, lightweight full-stack application template built with Turborepo. It consists of two main apps: a React single-page application (Vite + TanStack Router/Query/Form) for the frontend, and a Hono (Node.js) server providing an oRPC-based API with OpenAPI (Scalar) documentation. Authentication is handled by better-auth (email/password) with PostgreSQL via Drizzle ORM. The system supports CRUD operations for posts, includes dark/light theme toggling, and is fully containerized with Docker. The architecture follows a modular monorepo structure with shared packages for API contracts (oRPC), authentication, database schema and client, UI components (shadcn/ui), and reusable tooling configurations (ESLint, Prettier, Tailwind CSS, TypeScript). The codebase demonstrates strong engineering practices: environment variable validation with valibot, type-safe API contracts with oRPC, session-based auth with CORS, and a robust monorepo setup with Turborepo caching and dependency management.
This repository contains a Tailwind CSS plugin that adds 3D transform capabilities. The plugin provides utility classes for 3D transformations (scale, rotate, translate on X, Y, Z axes) and 3D animations (bounce, spin, bounce-and-spin). It supports both modern CSS properties (rotate, scale, translate) and legacy transform syntax for backward compatibility. The architecture follows Tailwind's plugin pattern, with modular organization separating animations, utilities, and helper functions. The plugin integrates with Tailwind's configuration system to allow customization of values and works by registering utility classes and animations that generate appropriate CSS when processed by Tailwind.
Materio is a free admin dashboard starter template built on Next.js 14 App Router, MUI v5, and Tailwind CSS, published by ThemeSelection. It ships as two parallel, functionally identical codebases: javascript-version/ and typescript-version/. Everything in the repo is static UI - hardcoded demo data, mock ApexCharts, placeholder auth forms - there is no API layer, database, or authentication logic. Its job is to be a polished starting point for admin applications, and it executes that role well: an extensive per-component MUI theme override system, a custom collapsible vertical menu subsystem, and a cookie-persisted settings context for dark/light mode. Architecturally it follows Next.js App Router conventions: root layout (app/layout.jsx), a dashboard layout that wraps the VerticalLayout shell (navigation, navbar, footer), and a blank layout for login/register/error pages. The most interesting engineering lives in src/@menu (a self-contained vertical navigation layer with context-driven collapse/expand and breakpoint behavior), src/@core/theme (dozens of isolated MUI component overrides), and a few genuinely reusable React hooks (useObjectCookie, useImageVariant). All dashboard data is fabricated; adopters must wire real data and backend logic themselves. The template is actively maintained (last commit March 2026, one open issue, automated issue triage workflows). Drift risks are version pinning to Next.js 14 / MUI v5.15 and the maintenance cost of keeping JS and TS variants in sync.
PrimeReact is a comprehensive React UI component library providing over 80 components including forms, data tables, overlays, menus, charts, and more. The repository also contains its official documentation website built with Next.js, featuring live demos, code snippets, accessibility guides, and theming documentation for both styled and unstyled (Tailwind) modes. The library follows a consistent architecture: each component extends a shared ComponentBase that defines default props, CSS classes, and pass-through theming support. It includes a custom hooks library, SVG icon set, and utility modules. However, the project is no longer under active development; only security fixes are published, with all new features and bug fixes moving to the PrimeUI fork. This has led to a growing divergence and a backlog of unresolved issues. The codebase shows signs of technical drift such as aging dependencies (Next.js 12), deprecated patterns, and extensive duplication in documentation and style definitions.
This repository implements a full-featured graphic design SaaS application, a clone of Canva. It is built with Next.js 14 (App Router), React 18, TypeScript, Tailwind CSS, and uses Fabric.js 5.3.0 for the canvas editor. The application allows users to create visual projects (designs) with layers including shapes, text, images, drawings, and AI-generated content. It supports background removal, image filters, color manipulation, and font adjustments. Authentication is handled via NextAuth v5 with credentials, GitHub, and Google OAuth, integrated with a PostgreSQL database through Drizzle ORM. Subscriptions (Free/Pro tiers) are managed via Stripe, limiting certain features like unlimited projects and AI capabilities. The dashboard lists user projects and templates, while the editor provides a rich toolbar, collapsible sidebars, and keyboard shortcuts. External dependencies include Unsplash for stock images, UploadThing for user file uploads, Replicate for AI inference (image generation, background removal), and Stripe for payments. The architecture follows a feature-based module structure with dedicated folders for auth, editor, projects, subscriptions, AI, and images. Server API routes are built using Hono.js mounted under a catch-all route, and client-side data fetching uses TanStack Query. State management for modals and UI is handled by Zustand. The codebase is well-organized for a production-grade tutorial project but lacks automated tests and contains some type safety shortcuts.