FilamentF
Filament•6mo ago
bouly

Unable to create a custom theme

Hello,

When I follow the documentation, I get the message :
⇂ It looks like you have Tailwind v4 installed. Filament uses Tailwind v3. You should downgrade your project and re-run this command with `--force`, or use the following command to compile the theme with the Tailwind v3 CLI:
⇂ npx tailwindcss@3 --input ./resources/css/filament/admin/theme.css --output ./public/css/filament/admin/theme.css --config ./resources/css/filament/admin/tailwind.config.js --minify
⇂ Make sure to register the theme in the admin panel provider using `->theme(asset('css/filament/admin/theme.css'))`


So I do it. And I add my css file in the vite.config.js.
But when I try to compile it. I get this error : 
[@tailwindcss/vite:generate:build] Can't resolve 'tailwind.config.js' in 'C:\Users\foo\Herd\bar\resources\css\filament\admin'
file: C:\Users\foo\Herd\bar\resources\css\filament\admin\theme.css


Here is my theme.css file 
@tailwind base;
@tailwind components;
@tailwind utilities;
@tailwind variants;
@import '../../../../vendor/filament/filament/resources/css/base.css';

@config 'tailwind.config.js';


My tailwind.config.js file :
import preset from '../../../../vendor/filament/filament/tailwind.config.preset'

export default {
    presets: [preset],
    content: [
        './app/Filament/**/*.php',
        './resources/views/filament/**/*.blade.php',
        './vendor/filament/**/*.blade.php',
    ],
}


Could you help me please?

I tried a lot of different thing. When I downgrade tailwind before creating the theme, the compilation works. But the website is broken and the default tailwind style is not applied...

Thanks!
Solution
makes sense, if you don't specify the config file it will try to use the default one.
Jump to solution
Was this page helpful?