Tailwind · Laravel Fmt docs

Laravel Fmt sorts Tailwind classes in the official Tailwind v4 order. No plugin needed.

Enabling it

Sorting turns on when a .css file anywhere under resources/css/ imports Tailwind, directly or through another @import.

resources/css/app.css

@import "tailwindcss";

To name the stylesheet yourself, set tailwind.stylesheet in laravel-fmt.json to a path or a list of paths. Prettier’s tailwindStylesheet is read too.

Tailwind v3 is not supported. Classes are always sorted in the v4 order.

Your theme tokens

Your @theme, @utility, and @custom-variant definitions are read, including ones in imported files. Classes built from them sort with the built-in ones. A class Tailwind would not generate sorts first.

resources/css/app.css

@import "tailwindcss";

@theme {
    --color-brand: #ff2d20;
    --spacing-gutter: 1.75rem;
}

Here bg-brand sorts with the other background colors, and p-gutter with the other spacing classes.

Blade in class lists

A class touching a Blade echo stays where it is. Classes never move across it.

Blade

<div class="rounded p-4 bg-{{ $color }}-500">

A trailing !important stays last.

Where it applies

class attributes in Blade, Livewire 4, and HTML
class strings in :class and @class([...])
$attributes->class(...) and $attributes->merge(['class' => ...]), slot attributes included
@apply in CSS

A class attribute or class string that spans several lines is not sorted.