# FlatColorPicker Views

The FlatColorPicker enables you to configure its views through the [`views`](https://www.telerik.com/kendo-angular-ui-develop/components/inputs/api/flatcolorpickercomponent#views) configuration option. You could display a `gradient` view, `palette` view or both. By default both views will be rendered, in which case the user can toggle between them by using the view toggle buttons rendered in the header of the component.

The following example demonstrates both FlatColorPicker views in action.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/inputs/flatcolorpicker/views/source.txt)

## Active View

When both the `palette` and `gradient` views are present, the initially active view of the FlatColorPicker can be set through the [`activeView`](https://www.telerik.com/kendo-angular-ui-develop/components/inputs/api/flatcolorpickercomponent#activeView) property. By default, the `gradient` view is rendered as active.

The following example shows how to specify the initially active view.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/inputs/flatcolorpicker/active-view/source.txt)

## Suggested Links

* [Customizing the FlatColorPicker](https://www.telerik.com/kendo-angular-ui-develop/components/inputs/flatcolorpicker/customization)
* [API Reference of the FlatColorPicker](https://www.telerik.com/kendo-angular-ui-develop/components/inputs/api/flatcolorpickercomponent)