Files
awesome-awesomeness/terminal/tailwindcss
2025-07-18 22:22:32 +02:00

138 lines
14 KiB
Plaintext
Raw Permalink Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
 
 
 
 
 is a utility-first CSS framework for rapidly building custom user interfaces.
 
 
 

 
  
 

 
 
 
Contents
- Useful links (#useful-links)
- IDE extensions (#ide-extensions)
- Tools (#tools)
- UI libraries, components & templates (#ui-libraries-components--templates)
- Plugins (#plugins)
Useful links
Legend: 💙 Official resource
- 💙 Website (https://tailwindcss.com) - Official Tailwind CSS website.
- 💙 Repository (https://github.com/tailwindcss/tailwindcss) - Official Tailwind CSS repository.
- 💙 Tailwind Plus (https://tailwindcss.com/plus) - UI blocks, templates, and a UI kit by the Tailwind CSS team.
- 💙 Headless UI (https://github.com/tailwindlabs/headlessui) - Completely unstyled, fully accessible UI components.
- 💙 Heroicons (https://heroicons.com/) - Beautiful, hand-crafted SVG icons.
- 💙 Play (https://play.tailwindcss.com/) - Advanced online playground for Tailwind CSS.
- 💙 Discord (https://tailwindcss.com/discord) - Official Discord server to connect with other community members about Tailwind CSS.
- Tailwind Weekly (https://tailwindweekly.com/) - Weekly newsletter about all things Tailwind CSS.
IDE extensions
Legend: 💙 Official resource
- 💙 Intellisense for Code (https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) - Provides IntelliSense in Visual Studio Code.
- LSP support for Emacs (https://github.com/merrickluo/lsp-tailwindcss) - LSP support for Emacs.
- Editor support for VS2022 (https://github.com/theron-wang/VS2022-Editor-Support-for-Tailwind-CSS) - 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 (https://github.com/tailwindlabs/prettier-plugin-tailwindcss) - Official Tailwind CSS plugin for Prettier.
- 🎨🌍🔧 UI colors (https://uicolors.app/create) - Color palette generator for Tailwind CSS.
- 🎨🌍🔧 Tailwind Color Shades (https://javisperez.github.io/tailwindcolorshades) - Color shades generator for Tailwind CSS.
- 🎨🌍🔧 TailwindInk (https://tailwind.ink/) - AI palette generator, trained with the Tailwind CSS palette.
- 🎨🌍🔧 Hypercolor (https://hypercolor.dev/) - Collection of Tailwind CSS gradients with directional options.
- 🎨🌍🔧 Tints (https://www.tints.dev/) - Color palette generator and API for Tailwind CSS.
- 🎨🌍🔧 Fullwind CSS (https://fullwindcss.com/) - Extend Tailwind CSS color palettes with additional shades.
- 🎨🌍🔧 Inclusive colors (https://www.inclusivecolors.com/) - Create fine-tuned WCAG accessible Tailwind CSS color palettes.
- 🔼🌍 Prefixer (https://github.vue.tailwind-prefix.cbass.dev) - Tailwind classes' prefixer tool.
- 🔼 RustyWind (https://github.com/avencera/rustywind) - CLI tool for sorting Tailwind CSS classes.
- 🚀 Maizzle (https://maizzle.com/) - Framework for rapid email prototyping with Tailwind CSS.
- 💼 @nuxtjs/tailwindcss (https://github.com/nuxt-community/tailwindcss-module) - Tailwind CSS module for NuxtJS with PurgeCSS and modern CSS (preset env 1).
- 💼 tailwindcss-rails (https://github.com/rails/tailwindcss-rails) - Gem for using Tailwind CSS with Rails' asset pipeline.
- 💼 Config viewer (https://github.com/rogden/tailwind-config-viewer) - Local UI tool for visualizing your Tailwind CSS configuration file.
- 💼 Raycast extension (https://www.raycast.com/vimtor/tailwindcss) - Search classes, documentation and colors in Raycast Launcher.
- 💼 NativeWind (https://www.nativewind.dev) - NativeWind uses Tailwind CSS as scripting language to create a universal style system for React Native.
- 🌐 Gimli Tailwind (https://chromewebstore.google.com/detail/gimli-tailwind/fojckembkmaoehhmkiomebhkcengcljl) - Smart tools for Tailwind CSS as a browser extension.
- 🌐 CSS Variables Editor (https://www.cssvariables.com) - AI-powered Chrome extension for managing colors in daisyUI and shadcn/ui.
- 🌐 DivMagic (https://divmagic.com) - 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 (https://tailwindcss.com/plus/ui-blocks/marketing) - Component library made with Tailwind CSS.
- 💙📚 Headless UI (https://headlessui.com/) - Completely unstyled, fully accessible UI components.
- 💙📁 Catalyst (https://tailwindcss.com/plus/ui-kit) - Beautiful, accessible application UI kit for React.
- 🧩 shadcn UI (https://ui.shadcn.com) - Re-usable components built using Radix UI and Tailwind CSS.
- 🧩 Layouts for Tailwind (https://layoutsfortailwind.lalokalabs.dev) - Layouts and UI patterns for Tailwind CSS.
- 🧩 Meraki UI Components (https://merakiui.com) - Beautiful Tailwind CSS components that support RTL languages.
- 🧩 Kometa UI Kit (https://kitwind.io/products/kometa/components) - Free multi-purpose UI kit, built with Tailwind CSS.
- 🧩 HyperUI (https://hyperui.dev) - Open source marketing and ecommerce Tailwind CSS components.
- 🧩 Ripple UI (https://www.ripple-ui.com) - Clean, modern and beautiful Tailwind CSS components.
- 🧩 Pines UI (https://devdojo.com/pines) - Alpine and Tailwind CSS UI library.
- 🧩 Kokonut UI (https://kokonutui.com/) - Collection of modern, interactive customizable UI components.
- 🧩 8bitcn UI (https://8bitcn.com) - Re-usable retro components built using Shadcn UI and Tailwind CSS.
- 🧩 Xtend UI (https://github.com/xtendui/xtendui) - Tailwind CSS components with advanced interactions and animations.
- 🧩 Tremor (https://tremor.so) - React library to build charts and dashboards with Tailwind CSS.
- 📚 Daisy UI (https://github.com/saadeghi/daisyui) - UI Components for Tailwind CSS.
- 📚 Flowbite (https://flowbite.com/docs/getting-started/introduction/) - Component library built with Tailwind CSS.
- 📚 STDF (https://stdf.design) - Mobile web component library based on Svelte and Tailwind CSS.
- 📚 Preline UI (https://preline.co) - Open-source Tailwind CSS components library for any needs.
- 📚 Date picker (https://github.com/themesberg/tailwind-datepicker) - Adds a datepicker component built with Tailwind CSS and vanilla JavaScript.
- 📁 Built at lightspeed (https://www.builtatlightspeed.com/) - Massive directory of 500+ Tailwind templates, starters and UI kits.
- 📁 Admin One Vue 3 (https://github.com/justboil/admin-one-vue-tailwind) - Free Vue.js 3 Tailwind CSS admin template with Vite & Vue CLI support.
- 📁 Admin One React (https://github.com/justboil/admin-one-react-tailwind) - Free React.js Tailwind CSS admin template with Next.js & TypeScript.
- 📁 Flowbite Admin Dashboard (https://github.com/themesberg/flowbite-admin-dashboard) - Open-source admin dashboard template built with Tailwind CSS and Flowbite.
- 📁 Astro Template Resume (https://github.com/fortezhuo/fortezhuo.my.id) - Eye-catching resume template built with Astro, Tailwind CSS.
- 📁 Astro Template Cactus (https://github.com/chrismwilliams/astro-theme-cactus) - Tailwind CSS Astro starter template.
- 📁 Astro Template Ovidius (https://github.com/JustGoodUI/ovidius-astro-theme) - Tailwind CSS & Astro blog template.
- 📁 Astro Template Dante (https://github.com/JustGoodUI/dante-astro-theme) - Tailwind CSS & Astro blog/portfolio template.
- 📁 Statichunt (https://statichunt.com/tailwind-templates) - Open source directory of hand-picked free and premium Tailwind templates & starters.
Plugins
Legend: 💙 Official plugin · 🎨 Theming · 💼 Utilities · 🧩 Components · 🛑 Deprecated
- 💙🧩 Typography (https://github.com/tailwindlabs/tailwindcss-typography) - Adds a prose class for beautiful typographic defaults.
- 💙 Forms (https://github.com/tailwindlabs/tailwindcss-forms) - Adds better default styles to form elements.
- 🎨 Themer (https://github.com/RyanClementsHax/tailwindcss-themer) - Adds theming support for Tailwind CSS with CSS variables and variants.
- 💼 Bootstrap grid (https://github.com/karolis-sh/tailwind-bootstrap-grid) - Generates Bootstrap's style flexbox grid system.
- 💼 Dot & grid backgrounds (https://github.com/TheNaubit/tailwind-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 (https://github.com/stormwarning/tailwindcss-capsize) - Adds utilities to trim text whitespace, using Capsize (https://github.com/seek-oss/capsize).
- 💼 Scrollbar Hide (https://github.com/reslear/tailwind-scrollbar-hide) - Adds scrollbar-hide class for visual hide scrollbar.
- 💼 px to viewport (https://github.com/the-lemonboy/tailwindcss-px-to-viewport) - Adds utilities to automatically convert px to vw / vh.
- 💼🧩 Fluid (https://github.com/barvian/fluid-tailwind) - Adds fluid clamp() versions of every built-in utility.
- 🧩 Debug screens (https://github.com/jorenvanhee/tailwindcss-debug-screens) - Adds a component that shows the currently active screen (responsive breakpoint).
 
 
 ·
 
 
 
tailwindcss Github: https://github.com/aniftyco/awesome-tailwindcss