A comprehensive color picker component with support for saved colors, transparency, and various input methods.
<ColorPicker/>
component
Our standard color picker.
Our standard color picker, without hex
Our standard color picker, with transparent option
Saved colors toolbar
When provided, the savedColors
prop on the ColorPicker
element should be shaped as the following
Key | Type | Required | Purpose |
---|---|---|---|
colors | array | no | colors that should be saved |
handleColorSelect | function | no | additional callback for color tile click, calls onChange behavior of ColorPicker component when implemented here |
handleColorsEdit | function | yes | callback for settings button click |
with colors saved to account settings
without colors saved to account settings (empty state)
<ColorInput />
Component
Our standard Color Input.
Our standard Color Input with a label
Our standard Color Input with transparency.
Color Input with saved colors
This color input includes the ColorsUpdaterToolbar
component, introduced for the Saved Colors feature.