Change Default Colors in FilamentPHP

This content originally appeared on DEV Community and was authored by Ariel Mejia

Set Colors for Resources

Using filament we are able to define the colors for all the resources in the AppPanelProvider.php class, this class is typically the one that is created by default in a filament project installation command, we can define a lot of features in this case we are going to set the colors for the whole resources:

public function panel(Panel $panel): Panel
{
    return $panel
        ->default()
        ->id('app')
        ->path('/')
        ->login()
        ->colors([
            'primary' => Color::Slate,
            'gray' => Color::Gray
        ]);
}

Now all the genereated resources are going to use this colors, take in mind that the value of the colors is handle by a Color class provided by Filament in the namespace namespace Filament\Support\Colors and it provides an identifier for all the colors in the TailwindCSS color pallete.

Set colors in a custom action

You can define custom actions using vainilla livewire components, in this cases you would need to explicitly define the color by chaining the colors method:

->colors([
    'primary' => Color::Slate,
    'gray' => Color::Gray
])

This content originally appeared on DEV Community and was authored by Ariel Mejia