Color Picker
A color input with fresh color picker.
This component provides a user-friendly interface for selecting colors, enhancing the user experience in applications that require color input. It features a popover with a color picker and an input field to display the selected color in any format like Hex, RGB, HSL and HSV.
The component is designed to be easily integrated into forms or standalone, providing flexibility for developers.
Properties
Prop | Type | Description |
---|---|---|
onColorChange | function | Callback function called with color object when color changes. See example |
defaultColor | string | Set default selected color when picker will open. Allowed formates are hex, rgb, hsl and hsv. |
defaultColorFormat | string | Set default selected color format for defaultColor from hex/rgb/hsl/hsv. |
isOpacity | boolean | Show and allow to select Opacity in picker. by default |
isColorFormat | boolean | Show color format changer in picker. by default |
isEyeDropper | boolean | Show eye dropper in picker. by default |
Example
Color Input
Color Input with Formated Value
Color Palette Input
Can add max 4 colors