thaqebon

🚀 How to Use Tailwind v3 for Filament v3 While Keeping Tailwind v4 in Laravel 12 (Using Vite Separation)

Problem: Laravel 12 supports Tailwind CSS v4, but Filament v3 is tied to Tailwind v3. Using both together can cause conflicts.

This guide shows how I solved the problem by isolating Filament’s frontend stack — with its own Tailwind v3, Vite config, and PostCSS config — separate from the Laravel app, which uses Tailwind v4.

---

🛠️ Step-by-Step Solution

nathandaly

<?php

/**
 * Below is an the extended Filament resource your tenant panel resources
 * will have to extend so that the queries are scoped properly.
 */

namespace App\Filament;

use Filament\Resources\Resource;