Example of API in React Color Picker Component

All Controls
/
Color-picker
/
Api

This sample demonstrates customization of the ColorPicker component by using its properties from the property pane. Select any combination of properties from the property pane to customize the ColorPicker component.

More Details...

Loading....
Description

The ColorPicker is a user interface to select and adjust color values. This supports various color specifications like RGB (Red Green Blue), HSV (Hue Saturation Value), and Hex codes.

In this sample, ColorPicker is rendered with default configuration.

This sample can be customized further with the combination of ColorPicker properties from the property pane. For example,

  • Control (apply/cancel) buttons can be enabled or disabled using Show Buttons checkbox from the property pane.
  • You can select the color by entering the color value in the property pane Value textbox.
  • You can switch to 'Picker' and 'Palette' modes by clicking and selecting the mode from Select Mode dropdownlist.
  • you can enable or disable the ColorPicker using Disabled checkbox from property pane.
  • you can enable or disable the mode switcher using Mode Switcher checkbox from property pane.

More information about ColorPicker can be found in this documentation section.