awesome-tailwindcss on GitHub (aniftyco/awesome-tailwindcss)

awesome-tailwindcss README

Awesome Tailwind CSS

Tailwind CSS is a utility-first CSS framework for rapidly building custom user interfaces.

Useful links
IDE extensions
Tools
UI libraries, components & templates
Plugins

Useful links

Legend: 💙 Official resource

💙 Website - Official Tailwind CSS website.
💙 Repository - Official Tailwind CSS repository.
💙 Tailwind Plus - UI blocks, templates, and a UI kit by the Tailwind CSS team.
💙 Headless UI - Completely unstyled, fully accessible UI components.
💙 Heroicons - Beautiful, hand-crafted SVG icons.
💙 Play - Advanced online playground for Tailwind CSS.
💙 Discord - Official Discord server to connect with other community members about Tailwind CSS.
Tailwind Weekly - Weekly newsletter about all things Tailwind CSS.

IDE extensions

Legend: 💙 Official resource

💙 Intellisense for Code - Provides IntelliSense in Visual Studio Code.
LSP support for Emacs - Provides IntelliSense in Emacs.
Editor support for VS2022 - IntelliSense, linting, sorting, and more in Visual Studio 2022.

Tools

Legend: 🌍 Accessible online · 🌐 Browser extension · 🔼 Conversion or upgrade tool · 🔧 Generator · 🅰 Typing/enforcement · 💼 Plugins/Tools/Extensions for external services · 🎨 Color-related · 🚀 Framework

💙💼 Prettier plugin - Official Tailwind CSS plugin for Prettier.
🎨🌍🔧 UI colors - Color palette generator for Tailwind CSS.
🎨🌍🔧 Tailwind Color Shades - Color shades generator for Tailwind CSS.
🎨🌍🔧 TailwindInk - AI palette generator, trained with the Tailwind CSS palette.
🎨🌍🔧 Hypercolor - Collection of Tailwind CSS gradients with directional options.
🎨🌍🔧 Tints - Color palette generator and API for Tailwind CSS.
🎨🌍🔧 Fullwind CSS - Extend Tailwind CSS color palettes with additional shades.
🎨🌍🔧 Inclusive colors - Create fine-tuned WCAG accessible Tailwind CSS color palettes.
🎨🌍🔧 FreeColorPalettes.co - Generates a 50–950 Tailwind CSS color scale from any hex color.
🌍🔧 Base-2 Rounding - Spacing and sizing value picker for Tailwind CSS v4's bracketless arbitrary values.
🔼🌍 Prefixer - Tailwind classes' prefixer tool.
🔼 RustyWind - CLI tool for sorting Tailwind CSS classes.
🔼 Tailwind to Inline styles converter - Converts Tailwind CSS classes to inline styles in email templates.
🚀 Maizzle - Framework for rapid email prototyping with Tailwind CSS.
💼 @nuxtjs/tailwindcss - Tailwind CSS module for Nuxt.js with PurgeCSS and modern CSS (preset env 1).
💼 tailwindcss-rails - Gem for using Tailwind CSS with Rails' asset pipeline.
💼 Config viewer - Local UI tool for visualizing your Tailwind CSS configuration file.
💼 Raycast extension - Search classes, documentation and colors in Raycast Launcher.
💼 NativeWind - Uses Tailwind CSS as scripting language to create a universal style system for React Native.
🌐 Gimli Tailwind - Smart tools for Tailwind CSS as a browser extension.
🌐 CSS Variables Editor - AI-powered Chrome extension for managing colors in daisyUI and shadcn/ui.
🌐 DivMagic - Copy any web element and style as Tailwind CSS component.

UI libraries, components & templates

Legend: 💙 Official resource · 📚 UI library · 🧩 Copy-pastable components · 📁 Full templates

💙🧩 Tailwind UI - Component library made with Tailwind CSS.
💙📚 Headless UI - Completely unstyled, fully accessible UI components.
💙📁 Catalyst - Beautiful, accessible application UI kit for React.
🧩 shadcn UI - Re-usable components built using Radix UI and Tailwind CSS.
🧩 Layouts for Tailwind - Layouts and UI patterns for Tailwind CSS.
🧩 Meraki UI Components - Beautiful Tailwind CSS components that support RTL languages.
🧩 HyperUI - Open source marketing and ecommerce Tailwind CSS components.
🧩 Ripple UI - Clean, modern and beautiful Tailwind CSS components.
🧩 Pines UI - Alpine and Tailwind CSS UI library.
🧩 Kokonut UI - Collection of modern, interactive customizable UI components.
🧩 8bitcn UI - Re-usable retro components built using Shadcn UI and Tailwind CSS.
🧩 Xtend UI - Tailwind CSS components with advanced interactions and animations.
🧩 Tremor - React library to build charts and dashboards with Tailwind CSS.
🧩 Radian UI - Accessible, customizable React components built with Tailwind CSS, with a CLI.
📚 Daisy UI - UI Components for Tailwind CSS.
📚 Flowbite - Component library built with Tailwind CSS.
📚 STDF - Mobile web component library based on Svelte and Tailwind CSS.
📚 Date picker - Adds a datepicker component built with Tailwind CSS and vanilla JavaScript.
📚 Appica UI - Open-source React component library built on Tailwind CSS, with a matching Figma library.
📁 Built at lightspeed - Massive directory of 500+ Tailwind templates, starters and UI kits.
📁 Admin One Vue 3 - Free Vue.js 3 Tailwind CSS admin template with Vite & Vue CLI support.
📁 Admin One React - Free React.js Tailwind CSS admin template with Next.js & TypeScript.
📁 Flowbite Admin Dashboard - Open-source admin dashboard template built with Tailwind CSS and Flowbite.
📁 Astro Template Cactus - Tailwind CSS Astro starter template.
📁 Astro Template Ovidius - Tailwind CSS & Astro blog template.
📁 Astro Template Dante - Tailwind CSS & Astro blog/portfolio template.

Plugins

Legend: 💙 Official plugin · 🎨 Theming · 💼 Utilities · 🧩 Components · 🛑 Deprecated

💙🧩 Typography - Adds a prose class for beautiful typographic defaults.
💙 Forms - Adds better default styles to form elements.
🎨 Themer - Adds theming support for Tailwind CSS with CSS variables and variants.
💼 Bootstrap grid - Generates Bootstrap's style flexbox grid system.
💼 Dot & grid backgrounds - Adds bg-grid and bg-dot classes to add easy-to-customize grid and dot pattern backgrounds with just CSS.
💼 Leading Trim - Adds utilities to trim text whitespace, using Capsize.
💼 Scrollbar Hide - Adds scrollbar-hide class for visual hide scrollbar.
💼 px to viewport - Adds utilities to automatically convert px to vw / vh.
💼 tailwind-hitslop - Adds hit-slop utilities to invisibly expand touch targets, like React Native's hitSlop.
💼 tw-fade - Adds fade-t/-b/-x/-y utilities that enable scroll-aware edge fading.
💼🧩 Fluid - Adds fluid clamp() versions of every built-in utility.
🧩 Debug screens - Adds a component that shows the currently active screen (responsive breakpoint).

·

_{Contributions welcome! Read the contribution guidelines first.}

15.2K ·GitHub

Awesome-tailwindcss

What is this?

A curated list of resources for Tailwind CSS: official links, IDE extensions, tools, UI libraries/components/templates, and plugins.

Is this a library or just a list of links?

It is purely a curated awesome-list of external resources (sites, tools, plugins, components) — it contains no code to install itself.

How is the list organized?

It's split into sections: Useful links, IDE extensions, Tools, UI libraries/components/templates, and Plugins, each with legend icons marking official resources, color tools, generators, browser extensions, etc.

Are entries vetted or checked for quality?

Yes, a CI workflow called 'vouch-check-pr' runs on pull requests, suggesting submissions are reviewed before merging.

Who is this list for?

Developers using Tailwind CSS who want editor integrations, color/class tools, ready-made UI components, or plugins to extend the framework.

What kind of IDE extensions are listed?

Extensions providing IntelliSense for VS Code, Emacs (via LSP), and Visual Studio 2022, including the official Tailwind CSS IntelliSense plugin.

Are there tools for working with colors?

Several color-focused tools are listed, like UI colors, Tailwind Color Shades, TailwindInk (AI palette generator), Hypercolor, and Tints for generating or extending Tailwind color palettes.

What UI component libraries are included?

Libraries like shadcn UI, HyperUI, Daisy UI, Flowbite, and Tremor, ranging from copy-pastable components to full component libraries and admin dashboard templates.

What are similar projects?

awesome-vscode, daisyui, galaxy, awesome-shadcn-ui, awesome-github-vue, cult-ui, tamagui, TW-Elements

Which topics is it in?

postcss, apps, emacs, tailwind, extension, vscode-extension, vscode, chrome-extension, tailwindcss, component-library, awesome, ui-components

Creator: aniftyco
Size: 0.4 MB
Stars: 15.2K
Updated: CommitAug 14
Age: 8y
Commits · 90 Days

awesome-tailwindcss README