Style and appearance in EJ2 TypeScript Color picker control

8 May 20231 minute to read

To modify the ColorPicker appearance, you need to override the default CSS of ColorPicker component. Please find the list of CSS classes and its corresponding section in ColorPicker component. Also, you have an option to create your own custom theme for the controls using our Theme Studio.

CSS Class Purpose of Class  
  .e-custom-picker .e-container .e-handler To customized Color Picker selection handler
  .color-picker.e-dropdown-popup ul .e-container To customize the Color Picker container
  .color-picker.e-dropdown-popup ul .e-item.e-palette-item To customize the Color Picker pallete item
  .color-picker.e-dropdown-popup .e-container .e-switch To customize the Color Picker switch control
  .color-picker.e-dropdown-popup .e-container .e-slider-preview To customize the Color Picker slider control