Added colour not working

I've added the following colours to my site in a service provider with the following code:

    public function boot(): void
    {
        FilamentColor::register([
            'primary' => Color::Indigo,
            'secondary' => Color::Stone,
            'info' => Color::Blue,
            'success' => Color::Green,
            'warning' => Color::Yellow,
            'danger' => Color::Red,
            'gray' => Color::Gray,
            'red' => Color::Red,
            'orange' => Color::Orange,
            'yellow' => Color::Yellow,
            'green' => Color::Green,
            'blue' => Color::Blue,
            'purple' => Color::Purple,
            'pink' => Color::Pink,
        ]);
    }

    public function boot(): void
    {
        FilamentColor::register([
            'primary' => Color::Indigo,
            'secondary' => Color::Stone,
            'info' => Color::Blue,
            'success' => Color::Green,
            'warning' => Color::Yellow,
            'danger' => Color::Red,
            'gray' => Color::Gray,
            'red' => Color::Red,
            'orange' => Color::Orange,
            'yellow' => Color::Yellow,
            'green' => Color::Green,
            'blue' => Color::Blue,
            'purple' => Color::Purple,
            'pink' => Color::Pink,
        ]);
    }

However, when I try to use one of them in a view like so:

<span class="rounded-full bg-blue-200 px-2 py-1 text-xs text-blue-600">Test</span>

<span class="rounded-full bg-blue-200 px-2 py-1 text-xs text-blue-600">Test</span>

It doesn't colour anything. What am I doing wrong? (I've built assets)

Solution:

You need a custom theme if you are using any custom views so you can tell tailwind to scan those files.

Jump to solution

6 Replies

Solution

awcodes•3mo ago

You need a custom theme if you are using any custom views so you can tell tailwind to scan those files.

awcodes•3mo ago

https://filamentphp.com/docs/3.x/panels/themes#creating-a-custom-theme

Themes - Panel Builder - Filament

morty•3mo ago

Thanks. I do have a custom theme setup but these are published vendor views. Do I just need to add ./resources/views/vendor/**/*.php to my tailwind config?

Dennis Koch•3mo ago

Yes. Btw. that registration code is for using colors inside filament stuff. Not for your Tailwind Classes.

morty•3mo ago

By "inside filament stuff", do you mean like this or something else?

Tables\Columns\TextColumn::make('pivot.category.name')
                    ->label('Category')
                    ->badge()
                    ->color(function (string $state, Account $record): string {
                        return match ($record->pivot->category->colour) {
                            'red' => 'red',
                            'orange' => 'orange',
                            'yellow' => 'yellow',
                            'green' => 'green',
                            'blue' => 'blue',
                            'purple' => 'purple',
                            'pink' => 'pink',
                            default => 'gray',
                        };
                    }),

Tables\Columns\TextColumn::make('pivot.category.name')
                    ->label('Category')
                    ->badge()
                    ->color(function (string $state, Account $record): string {
                        return match ($record->pivot->category->colour) {
                            'red' => 'red',
                            'orange' => 'orange',
                            'yellow' => 'yellow',
                            'green' => 'green',
                            'blue' => 'blue',
                            'purple' => 'purple',
                            'pink' => 'pink',
                            default => 'gray',
                        };
                    }),

Dennis Koch•3mo ago

Yes.

Gaming

Programming

Added colour not working