DEV Community

Vivian Guillen
Vivian Guillen

Posted on • Edited on • Originally published at redpixelthemes.com

13 Tailwind CSS Courses, both free and paid

This post was originally posted on Red Pixel Themes.


Free

Course Image

Introduction to Tailwind and the Utility First Workflow

Get it here

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.

Course Image

Tailwind Complete Course For Beginner to Advanced

Get it here

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".

Course Image

Tailwind CSS: From Zero to Production

Get it here

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.

Course Image

Tailwind CSS Tutorial

Get it here

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 from scratch

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.

Course Image

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.

Course Image

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.

Course Image

*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

Course Image

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.

Course Image

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.

Course Image

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.

Course Image

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...

Course Image

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.

Top comments (0)