All Courses
beginner CSS

Tailwind CSS: Utility-First Styling from Scratch

Master Tailwind CSS from scratch — utility-first styling from scratch.

53 lessons 8 available ~29 min total
Start the course

What you'll learn

By the end you can confidently apply Tailwind CSS at a beginner level: utility-first styling from scratch, with real, working code.

Who it's for

Developers learning Tailwind CSS at a beginner level.

Prerequisites

HTML and basic CSS.

A structured, hands-on beginner course on Tailwind CSS, taking you from scratch by building a responsive marketing site.

Curriculum

  1. 1

    The Utility-First Philosophy

    4 min
  2. 2

    Setting Up Tailwind via CDN

    4 min
  3. 3

    Understanding the Tailwind CLI

    3 min
  4. 4

    Applying Text and Color Utilities

    3 min
  5. 5

    Mastering Spacing and Sizing

    4 min
  6. 6

    Project Setup and Hero Structure

    3 min
  7. 7

    Polishing the Hero Section

    4 min
  8. 8

    Box Model Fundamentals

    4 min
  9. 9

    Flexbox Layout Basics

    Coming soon
  10. 10

    Building the Navigation Bar

    Coming soon
  11. 11

    Grid Layout Fundamentals

    Coming soon
  12. 12

    Designing the Feature Grid

    Coming soon
  13. 13

    Responsive Design Principles

    Coming soon
  14. 14

    Implementing Responsive Modifiers

    Coming soon
  15. 15

    Making the Hero Responsive

    Coming soon
  16. 16

    Responsive Navigation

    Coming soon
  17. 17

    Fluid Feature Grids

    Coming soon
  18. 18

    Hover States and Modifiers

    Coming soon
  19. 19

    Focus and Active States

    Coming soon
  20. 20

    Styling Buttons

    Coming soon
  21. 21

    Form Input Styling

    Coming soon
  22. 22

    Building the Newsletter Form

    Coming soon
  23. 23

    Intro to @apply

    Coming soon
  24. 24

    Component Abstraction Strategy

    Coming soon
  25. 25

    Mastering Shadows and Depth

    Coming soon
  26. 26

    Borders and Rounded Corners

    Coming soon
  27. 27

    Typography Refinement

    Coming soon
  28. 28

    Implementing Dark Mode

    Coming soon
  29. 29

    Customizing the Theme

    Coming soon
  30. 30

    Optimizing for Production

    Coming soon
  31. 31

    Final Polish of the Marketing Site

    Coming soon
  32. 32

    Introduction to Tailwind Plugins

    Coming soon
  33. 33

    Managing Z-Index and Positioning

    Coming soon
  34. 34

    Background Images and Gradients

    Coming soon
  35. 35

    Transforming Elements

    Coming soon
  36. 36

    Transitions and Animations

    Coming soon
  37. 37

    Working with SVGs

    Coming soon
  38. 38

    Accessibility Best Practices

    Coming soon
  39. 39

    Advanced Responsive Patterns

    Coming soon
  40. 40

    Building a Card Component

    Coming soon
  41. 41

    Building a Testimonial Section

    Coming soon
  42. 42

    Building a Footer

    Coming soon
  43. 43

    Managing Global Styles

    Coming soon
  44. 44

    Using Tailwind with Frameworks

    Coming soon
  45. 45

    Debugging Tailwind Styles

    Coming soon
  46. 46

    Managing CSS Conflicts

    Coming soon
  47. 47

    Implementing Modals

    Coming soon
  48. 48

    Building a Dropdown Menu

    Coming soon
  49. 49

    Using Arbitrary Values

    Coming soon
  50. 50

    Performance Optimization

    Coming soon
  51. 51

    Building a Pricing Table

    Coming soon
  52. 52

    Advanced Hover Effects

    Coming soon
  53. 53

    Responsive Images

    Coming soon