Tailwind CSS Overview

• What is Tailwind?
• Tailwind CSS Vs CSS
• Installing Tailwind

Tailwind Basics

• Utilities
• Preflight
• Duplication
• Prefixes
• CSS Units

Typography

• Size and Shape
• Color and Opacity
• Alignment and Spacing
• Lists
• Typography Plugin
• Tailwind Forms

Box

• Padding and Margins
• Borders
• Background Color
• Background Images
• Height and Width

Page Layout

• Containers
• Floats and Clears
• Position and Z-Index
• Tables
• Grids
• Flexbox
• Box Alignment

Animations

• Helpful Small Animations
• Transitions
• Transformation
• Other Appearance Things

Responsive Design

• Tailwind Screen Width and Breakpoints
• Hide Base on Size
• Fewer Grid Columns on Small Devices
• Flex on Larger Devices

Customizing Tailwind

• Configuration File Basics
• Change Default Values
• Change Generated Classes
• Configure Variant Prefixes
• Integrate with Existing CSS
• Access Tailwind from JavaScript
• Purge CSS