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

KendoReact ColorGradient Overview

The KendoReact ColorGradient renders a gradient, a hue and an alpha slider, and inputs to manually enter the desired color.

The KendoReact ColorGradient 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 ColorGradient in action.

Example
View Source
Change Theme:

The ColorGradient 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 ColorGradient and the rest of the components in the package, see the Getting Started with the KendoReact Inputs guide.

Key Features

  • Disabled ColorGradient—You can render a disabled ColorGradient by setting a single property and keep it disabled until certain requirements are met.
  • Controlled mode—You can take advantage of the built-in options that allow you to control the value of the ColorGradient.
  • Removing opacity inputs—The ColorGradient supports options that allow the user to specify whether an alpha slider and an alpha input will be rendered.

In this article

Not finding the help you need?