The ui5-color-picker allows users to choose any color and provides different input options for selecting colors.
Usage
When to use:
users need to select any color freely.
When not to use:
Users need to select one color from a predefined set of colors. Use the ColorPalette component instead.
ES6 Module Import
import "@ui5/webcomponents/dist/ColorPicker.js";
Properties/Attributes
You can use both properties and attributes with the same effect. The name of each attribute is listed below the name of the property, if different.
Name
Type
Default Value
Description
color
CSSColor
Defines the currently selected color of the component.
Note: use HEX, RGB, RGBA, HSV formats or a CSS color name when modifying this property.
Events
This Web Component fires semantic events upon user interaction. You can bind to these events with the standard DOM APIs, such as addEventListener.
Name
Description
change
Fired when the the selected color is changed
Theme:Morning Horizon (Light)Evening Horizon (Dark)Horizon High Contrast BlackHorizon High Contrast WhiteQuartz LightQuartz DarkQuartz High Contrast BlackQuartz High Contrast White
