13 Tailwind CSS Courses, both free and paid
By Vivian
/May 06, 2022
# Free
# Introduction to Tailwind and the Utility First Workflow
Important bits
- Duration: 1.15 hours
- Adam Wathan is the instructor (one of the Tailwind CSS creators)
- The other 3 parts of this course are paid and available for $25/m
Description
Meet Tailwind, a utility-first CSS framework for rapidly building custom user interfaces.
Tailwind provides us with highly compassable utility classes but leaves the design specification completely up to the user to maintain that custom look and feel to your app.
# Tailwind Complete Course For Beginner to Advanced
Important bits
- Duration: 2.5 hours
- Course level: Beginner
Description
In this course, we will look at Tailwind CSS in detail. we will look at all the basics and advanced concepts of tailwind. Tailwind is different from other frameworks, such as Bootstrap and foundation, because it is built on a new way of building user interfaces using a utility-first CSS classes structure. Before you take this course make sure you have a basic understanding of "CSS".
# Tailwind CSS: From Zero to Production
Important bits
- Duration: 1.5 hours
- Course level: Beginner
- It’s made by the Tailwind Labs team and provides source code
Description
This course walks you through everything from the initial setup process, to building out a responsive design with utility classes, to customizing your design system, to optimizing for production with PurgeCSS.
# Tailwind CSS Tutorial
Important bits
- Duration: 1.8 hours
- Course level: Beginner
Description
In this course, you will learn how to install Tailwind CSS in your project, design with the utility first workflow, how to use Tailwind CSS for responsive design, and how to extract Tailwind CSS component classes.
# Paid
# Tailwind CSS From Scratch | Learn By Building Projects
Price: $16.99+ | Get it here
Important bits
- Duration: 12.5 hours
- Course level: Intermediate
- Includes resources
Description
This is a fun project-based course to learn how to create awesome layouts using the Tailwind CSS framework and get comfortable using utility classes over something like Bootstrap, which uses component-based classes.
# Tailwind CSS - A new way to > THINK < CSS
Price: $13.99-24.99 | Get it here
Important bits
- Duration: 7.5 hours
- Includes 4 articles and 6 downloadable resources
- Includes a short introduction to alpine.js
- Course level: Intermediate
Description
This course shows the Ins and Outs of how to install, configure and in many examples how to apply Tailwind CSS. Also teaches responsive Layouts, Animations, and much more. This course will literally push forward your front-end development. Having some experience with CSS is necessary. Experience with other CSS frameworks like Bootstrap will help but are not mandatory.
# Beginner Tailwind
Price: $60+ | Get it here
Important bits
- Duration: 9.5 hours
- Course level: Beginner
- Has 50% off student discount
Description
This isn't just a Tailwind course. This is also a "learn how to design with CSS" course. The content includes building header, cards, FAQs, button, grid, newsletter and so much more. This course is aimed at people that have some CSS knowledge and want to learn Tailwind.
# Tailwind CSS : A Modern Way To Build Websites Using CSS
Price: $13.99-84.99 | Get it here
Important bits
- Duration: 6.5 hours
- Includes 1 article and 3 downloadable resources
- Course level: Intermediate
Description
Learn Tailwind by building a fully responsive real estate portal & interactive dashboard. Must Be Familiar With Basics of HTML & CSS
# Learn Tailwind CSS Build Your Own Portfolio + Cool Projects
Price: $13.99-84.99 | Get it here
Important bits
- Duration: 5 hours
- Includes 6 downloadable resources
- Course level: Beginner
Description
This course will rapidly guide you to become a Tailwind UI designer. This course is friendly to those who know nothing about Tailwind CSS, as it start by teaching the basic concepts and style elements. It will first thoroughly explain the essential topics and concepts and go through the necessary Tailwind CSS documentation in order to teach the fundamentals.This course will enhance your front end design skills and you will appreciate how awesome Tailwind CSS actually is.
# Tailwind CSS 3.0: Fundamentals
Price: $13.99-84.99 | Get it here
Important bits
- Duration: 1.5 hours
- Includes 7 downloadable resources
- Course level: Intermediate
Description
You will learn about Tailwind CSS, you will discover and experience what makes it different from others. This course includes how to adapt the page to different screen sizes (responsive design), apply CSS states, design a dark mode, reuse your styles (don't repeat yourself principle) and learn how to install and use plugins.
# Learn Tailwind CSS
Price: $13/month | Get it here
Important bits
- Duration: 2 hours
- Course level: Intermediate
- If you subscribe you can also access other scrimba courses
Description
During this course we will be exploring the features of Tailwind CSS. Before taking this course, you should have a basic understanding of HTML and CSS.
# Tailwind CSS Mastery
Price: $13.99-29.99 | Get it here
Important bits
- Duration: 8.5 hours
- Course level: Beginner
Description
During this course, we will be exploring the features of Tailwind CSS. You will learn all the types of utility classes, how to use the utility classes properly in our project, how to customize the existing utilities of Tailwind, how to add new utility classes to our project, tailwind Layouts, responsive web design, and much more...
# Tailwind CSS: Build 2 Advanced Projects
Price: $19.99 | Get it here
Important bits
- Duration: 3.5 hours
- Course level: Advanced
Description
In this course, you will build 2 beautiful real-world production-ready websites together. You will see the basics, some of the advanced concepts, and techniques to achieve our needs. You will not only see the common designs(like cards, buttons and form inputs...) but we will go beyond and cover how you can make really great designs.
Sign up for Tailwind Weekly, our newsletter about
all things Tailwind CSS.
Check out a recent issue for a sample.