Tailwind CSS is a utility-first CSS framework for rapid UI development: in simpler words, it’s a CSS where class names are not based on their content but describe what they do. For example, it has a .text-center
to be used if you want align text to the center, an .opacity-75
class to set the opacity of an element to 75%, .float-right
class to moves the element to the right side of its container. Pretty easy, isn’t it?
That’s what they call a functional CSS (as opposed to “semantic CSS” or “separation of concerns”): it allows you to build content-agnostic CSS components and style a website at the speed of light.
You can read more about Tailwind CSS approach or just click on the button below and get started… it’s up to you!