Kendo UI for Angular

ColorPicker

  • Provide users with a predefined palette or a free-form gradient for a great UX when selecting colors.
  • Part of the Kendo UI for Angular library along with more than 100 professionally-designed components developers trust for all their Angular UI needs.
  • Get up and running quickly with award winning support, detailed documentation, demos, virtual classrooms and a 3-million-strong developer community.

Angular UI Component Library
Nasa, Visa, Microsoft Fox, Samsung, IBM World Bank Group, Volvo
  • Overview

    The Kendo UI for Angular Color Picker component provides users with a sleek and intuitive way to select and interact with colors in any Angular application. The component offers you to let users choose between a set of predetermined colors in a palette or select their own color from a gradient control.

    See Angular ColorPicker Overview demo.

    Kendo UI for Angular ColorPicker - Overview
  • View Types

    The Kendo UI for Angular ColorPicker allows you to choose between rendering either a color palette, a color gradient, or both, in the popup that appears when the user interacts with the component.

    See Angular ColorPicker View Types demo.

    Kendo UI for Angular ColorPicker - View Types
  • Disabled ColorPicker

    By default, the Kendo UI for Angular ColorPicker is enabled, which means users can interact with it. For scenarios that call for the Angular ColorPicker to prevent user interactions, the disabled state can be set with a single configuration option.

    See Angular ColorPicker Disabled ColorPicker demo.

    Kendo UI for Angular ColorPicker - Disabled
  • Read-Only ColorPicker

    The read-only property enables you to display the ColorPicker component and its value in the default enabled visual style, while it prevents users from changing the value.

    See Angular ColorPicker Read-Only ColorPicker demo.

    Kendo UI for Angular ColorPicker - Read-Only ColorPicker
  • Custom ColorPicker

    Every aspect of the Kendo UI for Angular ColorPicker can be customized to meet existing design requirements. You can customize the appearance and content of the input element, as well as what appears in the popup of the Angular ColorPicker.

    See Angular ColorPicker Custom ColorPicker demo.

    Kendo UI for Angular ColorPicker - Custom ColorPicker
  • Forms Support

    The Kendo UI for Angular ColorPicker supports both template-driven forms and Reactive forms.

    See Angular ColorPicker Forms Support.

    Kendo UI for Angular ColorPicker - Forms Support
  • Keyboard Navigation

    Every aspect of the Kendo UI for Angular ColorPicker can be navigated through and interacted with using keyboard navigation. This lets anyone interacting with the Angular ColorPicker use only their keyboard when selecting a color.

    See Angular ColorPicker Keyboard Navigation demo.

Kendo Angular UI Getting Started Background

Get Started with Kendo UI for Angular

Kendo UI