happytodev/filament-tailwind-color-picker

Specific Tailwindcss color picker for Filamentphp


README

Latest Version on Packagist GitHub Tests Action Status GitHub Code Style Action Status Total Downloads

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

Banner

Screenshots

Single Tailwind Color Picker in Filament

SCR-20220831-umu

Code integration example

SCR-20220831-usl

Filament Tailwind Color Picker works perfectly with other filaments fields

SCR-20220825-mge

Responsive on 1280x1024

1280x1024-SCR-20220831-w9u

Responsive on iPhone 12 Pro

390x844-iphone12pro-SCR-20220831-wdc

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

License

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