AI Features

0% completed

All LessonsFree Lessons (4)

Overview

Introduction to the Course

Getting Started with Tailwind CSS

CSS Frameworks Design System Tailwind Basics Building a Blog Starter Template Creating the Main Content Area Creating the Side Content Area Creating the Newsletter Form Section Conclusion: Getting Started with Tailwind CSS Quiz: Getting Started with Tailwind CSS Challenge: Creating a Header with Tailwind CSS Solution: Creating a Header with Tailwind CSS

Going Beyond the Basics

Advanced Tailwind Creating Tailwind Components Building Tailwind Components with Vue Creating a Responsive Layout Configuring Tailwind’s Styles Conclusion: Going Beyond the Basics Quiz: Going Beyond the Basics Challenge: Creating a Sticky Note Component with Vue Solution: Creating a Sticky Note Component with Vue

Building Complex Designs with Tailwind

Building Complex and Flexible Layouts with Tailwind’s Grid Utilities Creating Grid Layouts Creating a Complete Article Design Adding Image Effects Conclusion: Building Complex Designs with Tailwind Quiz: Building Complex Designs with Tailwind Challenge: Building a Cells Grid in Tailwind Solution: Building a Cells Grid in Tailwind

Customizing Tailwind and Optimizing Your Workflow

Customizing Tailwind Customizing Tailwind’s Theme Colors Customizing Tailwind’s Spacing Utilities A Practical Customization Example Adding Base Classes Creating Configuration Presets Conclusion: Customizing Tailwind and Optimizing Your Workflow Quiz: Tailwind Customization and Optimization Challenge: Creating a Color Preset Solution: Creating a Color Preset

Working with Tailwind Plugins

Using the Official Tailwind Plugins Adding the prose Class Customizing Plugins Building Custom Tailwind Plugins Creating the Arrows Plugin Conclusion: Working with Tailwind Plugins Quiz: Tailwind Plugins Challenge: Making Modifications to an Article Solution: Making Modifications to an Article

Conclusion

Project

E-commerce Store in Vue.js With Payment Integration

Understanding the Basics of Tailwind CSS

Wrap Up

Review the concepts we’ve covered throughout this course.

We'll cover the following...

Key takeaways

This marks the end of this course. If you’ve made it ...

Ask