Beginner Tailwind
9h 33m 19s
English
Paid
Course description
Tailwind makes writing CSS easier and lets us customize our designs faster than any other CSS framework. If you want a CSS framework that has pre-built components, then Tailwind may not be for you. If you want a CSS framework that lets you design quickly and customize your site, then Tailwind is gonna be a lot of fun.
Watch Online
Join premium to watch
Go to premium
| # | Title | Duration |
|---|---|---|
| 1 | Intro | 01:26 |
| 2 | Updated for Tailwind 2 | 00:54 |
| 3 | How I Design | 10:28 |
| 4 | CodePen Tailwind Template | 04:41 |
| 5 | CodePen Tips and Tricks | 08:46 |
| 6 | Tailwind Docs and Workflow | 04:26 |
| 7 | Tailwind Introduction | 08:51 |
| 8 | Resources | 03:21 |
| 9 | Overview & What We'll Build | 04:25 |
| 10 | Spacing w/ Margin and Padding | 07:09 |
| 11 | Box Properties | 08:25 |
| 12 | Sizing and Numbering System | 05:16 |
| 13 | Typography | 09:38 |
| 14 | Colors | 07:38 |
| 15 | Pseudo Classes | 03:49 |
| 16 | Transitions & Transforms | 07:24 |
| 17 | Animations | 02:11 |
| 18 | Restyling All the Things | 08:28 |
| 19 | Gradients | 05:56 |
| 20 | Layout and Positioning | 07:31 |
| 21 | Responsive Classes | 09:09 |
| 22 | Flexbox | 12:50 |
| 23 | Grid | 11:58 |
| 24 | Basic Card | 10:16 |
| 25 | Card w/ an Image | 12:05 |
| 26 | Horizontal & Responsive Card | 11:57 |
| 27 | Basic Buttons | 12:43 |
| 28 | Outlined and Shadowed Buttons | 06:51 |
| 29 | Grouped and w/ an Icon Buttons | 12:14 |
| 30 | Basic Form | 12:36 |
| 31 | Minimal Form | 11:43 |
| 32 | Pure Color Form | 11:16 |
| 33 | What We'll Build | 02:57 |
| 34 | Setting Up Our Build System | 11:30 |
| 35 | Purging Unused Classes | 04:48 |
| 36 | Customizing Colors | 04:44 |
| 37 | Deploying to Netlify | 08:10 |
| 38 | Tailwind in VS Code | 06:24 |
| 39 | Setting Up HTML | 04:59 |
| 40 | Header Layout | 06:17 |
| 41 | Header Styling | 07:05 |
| 42 | Header Responsive | 03:35 |
| 43 | Hero Layout | 07:32 |
| 44 | Hero Styling | 13:55 |
| 45 | Hero Fun Elements | 11:16 |
| 46 | Hero Responsive | 04:24 |
| 47 | Overview Layout | 06:23 |
| 48 | Overview Styling | 11:52 |
| 49 | Overview Fun Elements | 05:21 |
| 50 | Overview Responsive | 03:03 |
| 51 | About Layout | 07:06 |
| 52 | About Styling | 06:42 |
| 53 | About Responsive | 02:48 |
| 54 | What You'll Learn Layout | 09:25 |
| 55 | What You'll Learn Styling | 04:31 |
| 56 | What You'll Learn Fun Elements | 10:10 |
| 57 | What You'll Learn Responsive | 03:27 |
| 58 | Layout + Styling + Responsive | 10:47 |
| 59 | Pricing Layout | 08:52 |
| 60 | Pricing Styling | 10:31 |
| 61 | Pricing Fun | 08:54 |
| 62 | Pricing Responsive | 06:27 |
| 63 | Layout + Styling + Responsive | 05:46 |
| 64 | Footer Layout | 09:41 |
| 65 | Footer Styling | 10:31 |
| 66 | Footer Fun | 05:52 |
| 67 | Footer Responsive | 04:14 |
| 68 | Fixing Containers | 03:24 |
| 69 | Adding Links | 02:11 |
| 70 | Customizing Tailwind | 13:14 |
| 71 | Extracting Tailwind Styles | 06:41 |
| 72 | Tailwind and Vue | 12:52 |
| 73 | Tailwind Typography | 06:56 |
| 74 | Tailwind Tools | 04:35 |
| 75 | Videos Layout + Styling + Responsive | 14:02 |
| 76 | Recap | 01:57 |
| 77 | Outro | 01:07 |
Comments
0 commentsSimilar courses
50 Projects In 50 Days - HTML, CSS & JavaScript
Sources: udemy, Brad Traversy
This is a purely project-based course. It is geared toward beginners, but intermediate developers can also enjoy creating new things. This course includes 50 mini projects in HT...
18 hours 13 minutes 45 seconds
HTML/CSS Bootcamp - Learn HTML, CSS, Flexbox, and CSS Grid
Sources: udemy
Hi and welcome to the HTML/CSS Bootcamp course, where we'll walk through the same course I teach code bootcamp students around the world.
20 hours 55 minutes 14 seconds
Want to join the conversation?
Sign in to comment