• Material 3
  • Material 3 Dark
  • Fluent
  • Fluent Dark
  • Bootstrap v5
  • Bootstrap v5 Dark
  • Tailwind CSS
  • Tailwind CSS Dark
  • Material
  • Bootstrap v4
  • High Contrast
Mode Selection
Theme Selection
*Translated by Google Translator.
Essential Studio
All Controls

Example of API in ASP.NET Core Color Picker Control

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.


Choose a color

Show Buttons
Mode Switcher

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.