Tailwind CSS: Its Ecosystem, Flux, and Why Laravel Chose It

On January 7, 2026, Adam Wathan, the creator of Tailwind CSS, wrote in a GitHub discussion that the day before, 75% of the people on the engineering team had lost their jobs "because of the brutal impact AI has had on our business." He added one number: traffic to the docs was down about 40% from early 2023, "despite Tailwind being more popular than ever."

That paradox is where this article starts. Tailwind CSS has become the most downloaded and most cited CSS framework among developers, it's the foundation Laravel picked, and a whole ecosystem has grown around it, Flux included. I use Tailwind and Flux as the base for my projects, with a Flux Pro license, so here I'm laying out what it is, what changed in version 4, which packages matter and how Laravel got here.

What Tailwind CSS Is (and Why It's Divisive)

Tailwind is a "utility-first" CSS framework: instead of ready-made components like Bootstrap's buttons, it gives you thousands of small classes that each do one thing, combined directly in your HTML.

<!-- Bootstrap: a component with a predefined style -->
<button class="btn btn-primary">Save</button>

<!-- Tailwind: the style built from atomic classes -->
<button class="rounded-lg bg-indigo-600 px-4 py-2 font-semibold text-white hover:bg-indigo-500">
    Save
</button>

If you come from traditional CSS, the second version looks like a step backwards: styling is back in the HTML. Adam Wathan explained the reasoning in 2017, in his essay "CSS Utility Classes and Separation of Concerns": splitting HTML and CSS by "topic" produces stylesheets that grow out of control, while utility classes get reused everywhere and the final CSS stops growing with the project.

In practice this fits Blade and Livewire well: you build a component once, and the markup with its classes lives in a single place.

Tailwind CSS 4: What Changed

Version 4.0, released on January 22, 2025, is a ground-up rewrite. For Laravel developers, three changes matter most.

A much faster engine. Tailwind claims full builds up to 5x faster and incremental builds over 100x faster. On their reference project, the numbers look like this:

Configuration lives in CSS. The old tailwind.config.js is no longer needed: you define the theme with @theme, and every value becomes a native CSS variable you can use anywhere.

/* resources/css/app.css */
@import "tailwindcss";

@source "../views/**/*.blade.php";

@theme {
    --font-sans: "Inter", sans-serif;
    --color-brand-500: oklch(0.62 0.19 260);
}

An official Vite plugin, plus automatic detection of the files to scan, so you no longer maintain the template list by hand.

Later versions added useful pieces without upending anything: 4.1 (April 2025) brought text shadows and masks, 4.2 (February 2026) new color palettes and a webpack plugin, and 4.3 (May 2026) scrollbar and zoom utilities. If you're starting from a v3 project, there's an official migration tool: npx @tailwindcss/upgrade.

How Widespread It Really Is

Numbers from npm, the JavaScript package registry, show the shift clearly. In June 2020 Tailwind was downloaded 1.2 million times a month and Bootstrap 11 million. Tailwind overtook Bootstrap between 2022 and 2023. In May 2026 Tailwind passed 461 million monthly downloads, while Bootstrap sat at 26 million.

One caveat: downloads include automated installs from builds, pipelines and agents. The spike between January and May 2026, from 163 to 461 million a month, says more about automation than about people. But the gap with Bootstrap had been visible for years, in surveys too: in State of CSS 2024, Tailwind was the most cited framework, with 3,657 mentions against Bootstrap's 2,623.

The Ecosystem: Packages Built Around Tailwind

On its own, Tailwind is a set of classes. Part of why it became a standard is everything that grew around it, some built by the Tailwind team and some by the community.

Two things stand out. First, the most downloaded packages aren't component libraries but tools for people who build components, like tailwind-merge and class-variance-authority. They're the undergrowth beneath shadcn/ui and many React design systems. Second, "classic" component libraries like daisyUI and Flowbite have much smaller numbers, because the market has moved toward components you copy into your project or that ship with your framework.

Then there are Tailwind Labs' commercial products: Tailwind Plus (called Tailwind UI until March 2025), a collection of blocks and templates, and Catalyst, a React component kit. In practice, they're what pays for the free framework.

Flux UI: The Component Kit for Livewire

For anyone on the TALL stack (Tailwind, Alpine.js, Laravel, Livewire), Flux has become the go-to library. It was built by Caleb Porzio, the creator of Livewire, who unveiled it in his Laracon US 2024 keynote. Version 1.0 shipped in September 2024 and 2.0 in February 2025, adding a date picker, calendar and charts while, according to Laravel News, adding only 13 kB to the bundle.

You install it as a Composer package and wire it into your Tailwind CSS:

composer require livewire/flux

/* resources/css/app.css */
@import "tailwindcss";
@import "../../vendor/livewire/flux/dist/flux.css";

{{-- In the layout: light/dark appearance and Flux scripts --}}
@fluxAppearance
...
@fluxScripts

{{-- A component --}}
<flux:button variant="primary" wire:click="save">Save</flux:button>

Flux has a free tier with the basic components (buttons, inputs, modals, dropdowns and more) and a Pro version with advanced components such as tables, date pickers, a rich text editor, charts and kanban boards. The Pro license is a one-time purchase: $149 for one project, $299 for unlimited projects, $799 for a team, with free updates forever.

Why I Chose It

Before Flux I looked at several libraries for Livewire and Blade. Many were complex and heavy, others had dated designs, and some required writing JavaScript by hand to make the components work. Flux struck me as the cleanest, the easiest to use and the most complete, with steady development you can see in how often it ships. It's relatively lightweight and responsive, and it's the choice Laravel itself made. Working on the TALL stack, it was almost a natural pick, enough that I bought the Pro license.

Why Laravel Chose Tailwind

For years Laravel shipped with Bootstrap by default. Up to version 5.8, a new project's package.json included Bootstrap, jQuery and Vue. In June 2019 all frontend scaffolding moved into the separate laravel/ui package, and from there things changed.

The Jetstream decision wasn't painless: many developers used to Bootstrap pushed back. Taylor Otwell replied on X: "Nothing was taken from you. 'laravel/ui' still exists." (October 2020).

He explained his reasons later. On the Laravel Podcast in March 2022, talking about rebuilding Spark and Jetstream: "We also wanted to move away from Bootstrap to Tailwind," and Jetstream was "converted to Tailwind and sort of modernized." In a Q&A the same year, according to Laravel Daily's write-up, he was even more direct: "We use Tailwind at Laravel, we don't use Bootstrap at all, and we want to use the things that we use and like ourselves," acknowledging it had been "a controversial decision."

There's no technical manifesto explaining why Tailwind is better. There are three simpler reasons. The team already used it for its own products. Tailwind let the starter kits look modern without imposing Bootstrap's recognizable look. And Adam Wathan came from the Laravel community: he had spoken at Laracon US in 2016 and created courses like Test-Driven Laravel.

When Laravel 12 introduced the new starter kits, the official docs spelled out the combination: the React, Svelte and Vue kits use "Inertia 2, TypeScript, shadcn/ui, and Tailwind," while the Livewire kits use "the Tailwind-based Flux UI component library."

The 2026 Paradox: More Popular, Less Sustainable

Back to where we started. In the same GitHub discussion, Adam Wathan explained the mechanism: "The docs are the only way people find out about our commercial products, and without customers we can't afford to maintain the framework." The day before, he had declined to make the docs easier for language models to read, because it would mean even less traffic.

Put together, the data tells an uncomfortable story. Between January and May 2026 Tailwind's downloads nearly tripled, while the team building it was cut to a quarter of its engineers. Wathan's reasoning is straightforward: people who get their answer from an AI assistant don't visit the docs, so they never come across the paid products that fund the project.

The framework is MIT-licensed and the code belongs to everyone. The open question is a different one: how many open source projects run on the same model, free docs leading to paid products, and how long that model can hold when AI intercepts the traffic.

Tailwind CSS and Flux FAQ

Is Tailwind CSS free?

Yes. The framework is MIT-licensed. Only Tailwind Labs' commercial products, like Tailwind Plus, are paid.

Tailwind or Bootstrap?

It depends on the project. Bootstrap gives you ready-made components with a recognizable look; Tailwind gives you the building blocks for your own design. For new Laravel projects the choice has already been made by the official starter kits, which use Tailwind.

Where do you configure Tailwind CSS 4?

Directly in your CSS file, with @import "tailwindcss" and a @theme block for theme values. You no longer need tailwind.config.js.

Is Flux UI Pro free? How much does it cost?

Partly. Flux has a free tier with the basic components and a paid Pro version for advanced components such as tables, date pickers, charts and a text editor. The Pro license is a one-time payment: $149 for one project, $299 for unlimited projects, $799 for a team.

Does Flux work without Livewire?

No. Flux is built for Livewire and Blade and requires Livewire in the project. For React and Vue, Laravel's starter kits use shadcn/ui.

How do you migrate from Tailwind 3 to Tailwind 4?

With the official npx @tailwindcss/upgrade tool, which converts your configuration and the classes that changed. In Laravel projects you also need to update Vite, switching to the @tailwindcss/vite plugin.

A Solid Ecosystem, a Company to Watch

In mid-2026 Tailwind is the de facto standard for building interfaces with Laravel. The official starter kits, the download numbers and the ecosystem of packages built on top of it, Flux included, all say so. For anyone on the TALL stack, the Tailwind, Livewire and Flux trio covers almost everything you need to build an interface without hand-writing JavaScript.

The weak spot lies outside the code, which is free and will stay available. It's about the company behind it, which has to find a way to sustain itself in a world where AI increasingly gives the answers, and everyone who uses Tailwind every day has a stake in how that plays out.