illustration for Introduction to Tailwind and the Utility First Workflow

Design with Tailwind CSS MasterclassPart 1

Introduction to Tailwind and the Utility First Workflow

Instructor

Adam Wathan
1h 15m closed-captioning
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
4.8
600
people completed
Bookmark
Download
RSS

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.

Still Awesome

This course is direct from the library author and is still awesome even though it’s built on the previous version and there are minor API changes.

This course is part of the Design with Tailwind CSS Masterclass.

What you'll learn

  • Install Tailwind CSS in your project
  • Design with the utility first workflow
  • Use Tailwind CSS for responsive design
  • Extract Tailwind CSS component classes

Learner Reviews

  • Darko Antic
    a year ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    super clear and easy to follow

  • Learner
    a year ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    very informative, I like the explanation on tailwing.config.js and other use cases with

  • Mehmet Yarar aka Niyo
    2 years ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    some of the content is out of date since the latest tailwind version is 3, but still useful in understanding the principles.

  • Rod
    2 years ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    Adam gives you these powerful mindset about Tailwind that only an author can made

  • Learner
    2 years ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    Excellent detailed explanations on how Tailwind works, and from the creator of Tailwind

  • Learner
    2 years ago
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    Star icon$$$
    What did you like about this course?

    Really informative, useful course which helps me a lot on grasping the workflow with Tailwind. Highly recommend to learn this course to understand how to use Tailwind effectively.

Course Content

1h 15m • 8 lessons

    You might also like these resources:

    illustration for CSS Fundamentals

    CSS Fundamentals

    Tyler Clark・33m・Course

    Even the most experienced developer can learn something new when it comes to using and understanding how the browser interprets CSS. In this course, we will slowly style a website according to a mocked image

    illustration for Build Complex Layouts with CSS Grid Layout

    Build Complex Layouts with CSS Grid Layout

    Rory Smith・42m・Course

    CSS Grid layout is a two-dimensional layout method that gives you control over items in rows as well as columns. In this course we will look at multiple ways to divide the page into major regions with control of the size, position, and layer.

    illustration for Flexbox Fundamentals

    Flexbox Fundamentals

    Garth Braithwaite・18m・Course

    Flexbox is a wonderful tool built into the CSS specification. Using flexbox doesn't require any special framework or library, just a browser with CSS3 support. It is so awesome, and makes the arranging elements on a page almost fun!