awesome-tailwindcss
😎 Awesome things related to Tailwind CSS
https://github.com/aniftyco/awesome-tailwindcss
Last synced: 12 days ago
JSON representation
-
IDE extensions
- 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.
-
Plugins
- 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.
- Leading Trim - Adds utilities to trim text whitespace, using [Capsize](https://github.com/seek-oss/capsize).
- Scrollbar Hide - Adds `scrollbar-hide` class for visual hide scrollbar.
- Fluid - Adds fluid `clamp()` versions of every built-in utility.
- Debug screens - Adds a component that shows the currently active screen (responsive breakpoint).
- Dot & grid backgrounds - Adds `bg-grid` and `bg-dot` classes to add easy-to-customize grid and dot pattern backgrounds with just CSS.
- 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.
-
Tools
- 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.
- Maizzle - Framework for rapid email prototyping with Tailwind CSS.
- Raycast extension - Search classes, documentation and colors in Raycast Launcher.
- Gimli Tailwind - Smart tools for Tailwind CSS as a browser extension.
- Fullwind CSS - Extend Tailwind CSS color palettes with additional shades.
- Prettier plugin - Official Tailwind CSS plugin for Prettier.
- RustyWind - CLI tool for sorting Tailwind CSS classes.
- tailwindcss-rails - Gem for using Tailwind CSS with Rails' asset pipeline.
- Config viewer - Local UI tool for visualizing your Tailwind CSS configuration file.
- Inclusive colors - Create fine-tuned WCAG accessible Tailwind CSS color palettes.
- Tailwind to Inline styles converter - Converts Tailwind CSS classes to inline styles in email templates.
- UI colors - Color palette generator for Tailwind CSS.
- 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.
- NativeWind - Uses Tailwind CSS as scripting language to create a universal style system for React Native.
- 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
- Flowbite - Component library built with Tailwind CSS.
- Built at lightspeed - Massive directory of 500+ Tailwind templates, starters and UI kits.
- Pines UI - Alpine and Tailwind CSS UI library.
- Daisy UI - UI Components for Tailwind CSS.
- 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.
- Tailwind UI - Component library made with Tailwind CSS.
- Headless UI - Completely unstyled, fully accessible UI components.
- Catalyst - Beautiful, accessible application UI kit for React.
- Kokonut UI - Collection of modern, interactive customizable UI components.
- Xtend UI - Tailwind CSS components with advanced interactions and animations.
- Appica UI - Open-source React component library built on Tailwind CSS, with a matching Figma library.
- Layouts for Tailwind - Layouts and UI patterns for Tailwind CSS.
- Meraki UI Components - Beautiful Tailwind CSS components that support RTL languages.
- Ripple UI - Clean, modern and beautiful Tailwind CSS components.
- Radian UI - Accessible, customizable React components built with Tailwind CSS, with a CLI.
- shadcn UI - Re-usable components built using Radix UI and Tailwind CSS.
- HyperUI - Open source marketing and ecommerce Tailwind CSS components.
-
Useful links
- Heroicons - Beautiful, hand-crafted SVG icons.
- Play - Advanced online playground for Tailwind CSS.
- Tailwind Weekly - Weekly newsletter about all things Tailwind CSS.
- Headless UI - Completely unstyled, fully accessible UI components.
- Tailwind Plus - UI blocks, templates, and a UI kit by the Tailwind CSS team.
- Repository - Official Tailwind CSS repository.
- Website - Official Tailwind CSS website.
Programming Languages
Categories
Sub Categories
Keywords
tailwindcss
16
tailwind
11
tailwindcss-plugin
7
tailwind-css
6
css
4
astrojs
3
blog
3
react
3
components
3
vue
3
astro-template
3
astro
3
theme
3
plugin
3
dashboard
3
tailwind-plugin
2
javascript
2
astro-theme
2
markdown
2
tailwind-theme
2
postcss
2
ui-kit
1
ui-library
1
ui-framework
1
ui-design
1
svelte
1
ui-pattern
1
cli
1
dark-mode
1
themer
1
themes
1
theming
1
bootstrap4
1
flexbox
1
flexbox-grid
1
capsize
1
a11y
1
accessibility
1
headless-ui
1
headlessui
1
admin-dashboard
1
charts
1
flowbite
1
html
1
hugo
1
webpack
1
widget
1
component
1
component-library
1
css-components
1