---
title: Usage
position: 2
seo_title: Guidelines for Using the FlatColorPicker Component
seo_description: Get the knack of the Telerik and Kendo UI FlatColorPicker and
  learn how to use and implement the component by following the instructions and
  recommendations in the user guidelines created by our designers.
---

## Usage Guidelines

The Telerik and Kendo UI FlatColorPicker requires you to follow some basic principles when using the component.

### Purpose

Effective use of color selection tools in your user interface can have a significant impact on the user experience. It's important to strike a balance between versatility and simplicity when choosing between the FlatColorPicker and ColorPalette components. To provide a streamlined color selection experience, use the ColorPalette component or a simplified FlatColorPicker when the allowed colors are limited to a predefined set.

<DosDonts>
<Do description="Use a FlatColorPicker where a wide spectrum of color options is required, offering users the ability to precisely select and customize their desired colors.">![A Telerik and Kendo UI FlatColorPicker offering a wide spectrum of color options](images/components-flatcolorpicker-usage-purpose-do.png "Use the Telerik and Kendo UI FlatColorPicker to offer a wide spectrum of color options to choose from.")</Do>
<Dont description="Avoid using a FlatColorPicker in scenarios where users are restricted to a predefined color palette or don't need its advanced features. In such cases, use the ColorPalette component or a simplified FlatColorPicker offering only a palette view.">![A Telerik and Kendo UI FlatColorPicker improperly used instead of a ColorPalette](images/components-flatcolorpicker-usage-purpose-dont.png "Don't use the Telerik and Kendo UI FlatColorPicker when the available color options are limited.")</Dont>
</DosDonts>


### Compactness

In the field of user interface design, choosing the right color selection tool is crucial for an efficient and user-friendly design. When it comes to delivering intuitive and user-friendly interactions, FlatColorPickers are a good choice to allow precise color matching. However, in scenarios where compact design and space efficiency are priorities, such as toolbars, it's advisable to use a ColorPicker component instead.

<DosDonts>
<Do description="Use the FlatColorPicker component in user interfaces, such as sidebars or spacious layouts, where ample space is available.">![A Telerik and Kendo UI FlatColorPicker within a sidebar](images/components-flatcolorpicker-usage-compactness-do.png "Use a Telerik and Kendo UI FlatColorPicker where ample space is available.")</Do>
<Dont description="Avoid using FlatColorPickers in user interfaces, such as toolbars, where compact design and space efficiency are priorities. Use ColorPicker component instead.">![A Telerik and Kendo UI ColorPicker used instead of a FlatColorPicker](images/components-flatcolorpicker-usage-compactness-dont.png "Use a Telerik and Kendo UI ColorPicker when the space is limited.")</Dont>
</DosDonts>