• What is KendoReact
  • Getting Started
  • Unstyled Mode
  • Server Components
  • Components
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting

KendoReact ColorPalette Overview

The KendoReact ColorPalette renders colors by using sets of predefined colors (color presets) or by implementing a custom color palette.

The KendoReact ColorPalette component is part of the KendoReact library of React UI components. It is distributed through NPM under the kendo-react-inputs package.


The following example demonstrates the ColorPalette in action.

Example
View Source
Change Theme:

The ColorPalette is part of the KendoReact Inputs component library. The procedures for installing, importing, and using all components in the library are identical. To learn how to use the ColorPalette and the rest of the components in the package, see the Getting Started with the KendoReact Inputs guide.

Key Features

  • Disabled ColorPalette—You can render a disabled ColorPalette by setting a single property and keep it disabled until certain requirements are met.
  • Controlled mode—Take advantage of the built-in options that allow you to control the value of the ColorPalette.
  • Color presets—The ColorPalette provides a set of ready-to-use color presets.
  • Custom ColorPalette—You can customize the rendering of the ColorPalette by specifying the number of its columns and tile size.
  • Keyboard navigation— The ColorPalette supports keyboard shortcuts that allow the users to interact with the component.
  • Events—To tailor the behavior of the ColorPalette to your specific requirements, handle the events that the control generates.

In this article

Not finding the help you need?