Color picker

#Overview

The color picker component allows you to pick a color in a range of formats.

By default, the component uses HEX format:

use Filament\Forms\Components\ColorPicker;
 
ColorPicker::make('color')
use Filament\Forms\Components\ColorPicker;

ColorPicker::make('color')

#Setting the color format

While HEX format is used by default, you can choose which color format to use:

use Filament\Forms\Components\ColorPicker;
 
ColorPicker::make('hsl_color')
    ->hsl()
 
ColorPicker::make('rgb_color')
    ->rgb()
 
ColorPicker::make('rgba_color')
    ->rgba()
use Filament\Forms\Components\ColorPicker;

ColorPicker::make('hsl_color')
    ->hsl()

ColorPicker::make('rgb_color')
    ->rgb()

ColorPicker::make('rgba_color')
    ->rgba()

Edit on GitHub

Still need help? Join our Discord community or open a GitHub discussion