mirror of
https://github.com/aniftyco/awesome-tailwindcss.git
synced 2025-12-09 22:35:35 +00:00
028554cade
It's a personal site where I've been publishing short fictional writings for 15 years. Initially built with `nanoc` and `less`. Recently rewritten with `jigsaw` and `tailwindcss`.
14 KiB
14 KiB
Awesome Tailwind CSS 
A curated list of awesome things related to Tailwind CSS
Tailwind CSS is a utility-first CSS framework for rapidly building custom user interfaces.
Contents
Resources
- Tailwind Official Site
- Tailwind Official Repo
- Discussion Repo
- Webpack Starter Project
- Gusts - Tailwind CSS Playground
- Laravel Frontend Preset
- Ruby on Rails Example Project
- Tailwind Components
- Tailwind Themes
- Tailwind Cheat Sheet
- Alfred Workflow - Search Tailwind Docs with Alfred
- ng-tailwindcss - The happy marriage of Tailwind CSS with Angular CLI
- Tailwind Toolbox - Starter Templates
- Tailwind Templates
- Laravel Dark Tailwind Preset
- Add Your Item
Projects Using Tailwind CSS
Open Source
- Tailwind Jekyll Starter Kit
- Tailwind Gulp Starket Kit
- Tailwind Fiddle
- Wordpress Tailwind CSS + Google PWA
- Create React Native App Tailwind
- Gatsby Starter Tailwind
- Gatsby Tailwind CSS Emotion Starter
- Create React App Tailwind
- Jaxli - Feature Request System
- Goodwork - Project Management & Collaboration Tool
- Seminyak Hugo Theme
- Stitches - Website Generator with Tailwind
- Dogpatch - WordPress starter + Webpack, Vue, Babel and Tailwind CSS
- Adds Tailwind CSS to your Ember app or addon
- Create React App + Tailwind CSS + EmotionJS
- Statusfy: Statusfy is a Status Page System, easy to use and completely Open Source.
- Todolist - Laravel, Vue and Tailwind CSS
- Create React App, included with TailwindCSS and PurgeCSS
- Admin Panel Built On Tailwind
- Add Your Item
Apps/Websites
- Merched.com
- NiftyCo
- Josh Manders
- Matt Stauffer
- Miguel Piedrafita
- Webslides
- Lichter.io (Alexander Lichter)
- Rias
- Freek Van der Herten
- Taylor Bryant
- Oliver Davies
- BaseCode
- Joey Beninghove
- Stefan Bauer
- Jim Shannon
- Eyewitness.io
- Laravel Spark
- Snaptier
- Milan Chheda
- Matheus Lima
- CSS Cursors
- Developmint
- Rational Investment Management
- Stephen Popoola
- Laraboost
- Vince Mitchell
- Marco Mark
- Nehal Hasnayeen
- Plowman Craven
- Erik Campobadal
- Our Name is Mud
- BudgetDuo
- Quickwords
- The MBR Site
- Natures Finest Pet Supplies Holding Page
- Peter Fox
- Martin Williams
- Brahms Electric Hearses
- Woburn Mosaic Holding Page
- Crypto Contributors
- Sjabloon
- Guillaume Briday
- Hello Sun
- Onur Şuyalçınkaya
- Faruno: A unique email address for every service you use within one inbox
- University of West London
- OpenEmu
- Alice's Magical Maze
- sleeplessmind.info
- Add Your Item
Tools
- Color shades generator
- Color palette generator
- Zeplin Config & Class generator
- Tailwind CSS IntelliSense for VS Code
- Tailwind CSS Styled Snippets for VS Code
- Tailwind CSS IntelliSense for (neo)vim
- Add Your Item
Components & Libraries
- Convert Bootstrap CSS code to Tailwind CSS code
- Use Tailwind CSS with CSS-in-JS
- tails-ui
- Toggle switch
- Gatsby Plugin Tailwind CSS
- Pagination Template For Laravel
- Shift to the next Tailwind CSS version hassle-free
- Add Your Item
Plugins
- Aspect Ratio
- Card
- Fluid
- Flexbox Order
- Spinner
- Transitions - 1
- Transitions - 2
- Transitions - 3
- Bootstrap Tables
- Visually Hidden
- Writing Mode
- Alpha
- Cursor Extended
- Blend Mode
- Object Fit
- Image Rendering
- Text Indent
- Triangle After
- CSS Color Vars
- Responsive Embed
- Object Position
- Accessibility
- Layout
- Gradients - 1
- Gradients - 2
- Border Gradient
- Typography
- Transforms
- Filters
- Important
- Scrims
- Grid
- TailwindCSS variables - Transform Tailwind config file to CSS variables.
- Spaced Items - Add fixed margins to all container items except last one.
- Heropatterns - Streamlined integration between tailwindcss and heropatterns
- Caret Color - Coloring carets with tailwindcss colors
- Direction - RTL & LTR direction variants for Tailwind.
- Touch - Additional variants for touch based media queries.
- Elevation - Elevation classes taken from Material Components.
- Localized - Variant for utilities based on site language.
- Skip link - Adds an accessible 'skip to main content' link
- List Reset - Re-adds the
list-resetclass that was removed prior to Tailwind 1.0. - Vue.js - adds classes for showing and hiding elements in different display variations in combination with Vue's v-cloak directive.
- Add Your Item
Demos & Samples
- Tailwind CSS - Building a Login Page
- Rebuilding Laravel.io with Tailwind CSS
- Rebuilding Coinbase with Tailwind CSS - Codepen.
- Creating a modal dialog with Tailwind CSS
- Rebuilding FreshBooks with Tailwind CSS
- PingPing - We build a Login using Tailwind CSS
- Setting Up Tailwind in a Laravel Project
- How to Build a Vue.js Component With Tailwind in a Laravel Project
- Build a Customizable Vue.js Modal with Tailwind CSS
- Building a Nav with Tailwind CSS
- How to Style a Form With Tailwind CSS
- Building a Photo Gallery With CSS Grid and Tailwind CSS
- Create a Sticky Footer Using Tailwind CSS
- Interactive Tailwind + Vue Responsive Navbar
- Collection of marketing site templates
- Plugin Examples (Official)
- Rebuilding Twitter with Tailwind CSS - CodePen.
- Rebuilding YouTube with Tailwind CSS + plugins
- How to Add Tailwind CSS to an Ember App
- Laracasts Weekly Stream: Tailwind
- Rebuilding Netlify with Tailwind CSS
- Rebuilding Resolute
- How to setup Tailwind CSS in Sage (WordPress starter theme)
- More experimentation with Tailwind CSS
- Using Tailwind With GatsbyJS
- How to setup TailwindCSS in Phoenix 1.4
- jQuery + Tailwind Checkbox Toggle
- Rebuilding Acquia’s hosting dashboard with Vue.js and Tailwind CSS
- Rebuilding Bartik (Drupal’s default theme) with Vue.js and Tailwind CSS
- Add Your Item
Contribute
Contributions welcome! Read the contribution guidelines first.
License
To the extent possible under law, NiftyCo has waived all copyright and related or neighboring rights to this work.