1
HTML/CSSIntermediate#css#tailwind
HTML/CSSBeginner#css#tailwind
What is Tailwind CSS and how does it differ from writing custom CSS?
Answer
Tailwind is a utility-first CSS framework providing small, single-purpose classes (like flex, p-4, text-center) composed directly in markup, instead of writing custom class names and separate stylesheets. It speeds up development and avoids unused CSS bloat via its JIT purge, but can make markup verbose.
Example
<div class="flex items-center justify-between p-4 bg-white rounded-lg shadow-md hover:shadow-lg transition"> <h3 class="text-lg font-bold text-gray-800">Card Title</h3> <button class="px-4 py-2 bg-blue-600 text-white rounded">Action</button> </div>