Best of Tailwind CSS — December 2025

  1. 1
    Article
    Avatar of lobstersLobsters·24w

    Vanilla CSS is all you need

    Modern CSS has evolved to include native variables, nesting, container queries, and advanced features like :has() and color-mix(), making build tools and preprocessors unnecessary for many projects. An analysis of three production applications from 37signals (Campfire, Writebook, and Fizzy) reveals a consistent nobuild CSS architecture using OKLCH colors, character-based spacing, semantic component classes with minimal utilities, and progressive adoption of cutting-edge CSS features. The approach demonstrates that vanilla CSS can handle real-time chat, publishing platforms, and project management tools with 14,000 lines across 105 files, achieving sophisticated interactions like animated dialogs, dynamic theming, and stateful UI without JavaScript or build steps.

  2. 2
    Video
    Avatar of t3dotggTheo - t3․gg·23w

    Shadcn just changed forever

    Shadcn UI introduced a major update called Shadcn Create that puts customization front and center. Instead of websites looking identical with default components, developers can now configure presets, colors, fonts, icon sets, and styles before generating a project. The system supports multiple component libraries (Radix UI and Base UI), offers various design presets (Vega, Nova, Maya, Lyra, Mirror), and allows extensive theming options. Testing shows that providing AI coding assistants with a well-structured component library significantly improves UI generation quality, even for models typically weak at design. The update maintains Shadcn's philosophy of code ownership while making it easier to start with a unique design system.

  3. 3
    Article
    Avatar of phProduct Hunt·24w

    EaseMaster: A bezier curves & spring motion editor + code exporter

    EaseMaster is a visualization tool for creating and exporting cubic bezier curves and spring physics animations. It generates ready-to-use code for CSS, Tailwind, Framer Motion, and GSAP, helping developers design smooth easing functions and motion effects for web interfaces.

  4. 4
    Video
    Avatar of youtubeYouTube·23w

    4-Step Gemini 3.0 Pro System For Beautiful UI Designs

    A four-step workflow for generating UI designs using Gemini 3.0 Pro before building functionality. The process starts with creating a product requirements document (PRD), extracting core features and UX considerations, building a design system based on visual inspiration, and finally generating screen-by-screen designs with all states. The approach emphasizes designing upfront rather than treating UI as an afterthought, using structured prompts to guide the AI through creating a complete design system with colors, typography, and component specifications that can be implemented in React with Tailwind CSS.

  5. 5
    Video
    Avatar of joshtriedcodingJosh tried coding·24w

    Build a Complete Real-Time Chat with Next.js 16, Redis, Tailwind (2025)

    A comprehensive step-by-step tutorial building a privacy-focused real-time chat application using Next.js 16, Redis, and Tailwind CSS. The guide covers setting up Elysia for type-safe API routes, implementing TanStack Query for data fetching, creating dynamic routing patterns, and building features like auto-generated usernames, room creation with automatic 10-minute expiration, and real-time messaging. Includes best practices for project structure, naming conventions, and deployment-ready code patterns.

See all Tailwind CSS archives