Specific Tailwindcss color picker for Filamentphp

This plugin add a field in Filament Form to help you to select color in the Tailwind color's palette.

Screenshots

Single Tailwind Color Picker in Filament

Code integration example

Filament Tailwind Color Picker works perfectly with other filaments fields

Responsive on 1280x1024

Responsive on iPhone 12 Pro

Support us

You can support the development of this open-source package here

Installation

You need first a Filament installation working. For that, please read instructions on the Filament website.

You can install the package via composer:

composer require happytodev/filament-tailwind-color-picker

Optionally, you can publish the views using

php artisan vendor:publish --tag="filament-tailwind-color-picker-views"

Usage

For adding a background color picker :

    TailwindColorPicker::make('backgroundColor')
        ->bgScope(),

When user choose a color in the tailwindcss palette, the value returned by the form will be for example :

bg-red-300

For adding a text color picker :

    TailwindColorPicker::make('backgroundColor')
        ->textScope(),

When user choose a color in the tailwindcss palette, the value returned by the form will be for example :

text-red-300

Testing

composer test

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

Credits

• Frédéric Blanc
• All Contributors

License

The MIT License (MIT). Please see License File for more information.