Color picker

The color picker is used to let the merchant select a color visually. For example, merchants use the color picker to customize the accent color of the email templates for their shop.

Examples

Use when the merchant needs to select a color to make the selection a visual task rather than a technical one.

Drag to resize example

Props

allowAlpha
boolean
Allow user to select an alpha value
colorRequired
Color
The currently selected color
id
string
ID for the element
onChangeRequired
(color: HSBAColor) => void
Callback when color is selected

Best practices

  • Use the alpha slider if you want to allow merchants to be able to select a transparent color

Content guidelines

There are no customizable content elements in the color picker component.