Telerik blogs
We are proud to introduce the newest member of the Telerik XAML family - the Color Editor. With its powerful color selection mechanism, the Color Editor allows an intuitive way of picking your desired color. The Color Editor provides support for few of the major color modes - RGB, HSV, HLS and CMYK. In addition, the Color Editor allows you to edit each individual channel of the above mentioned color models.


Let's begin with the most basic declaration of the Color Editor in XAML.

<telerik:RadColorEditor Height="220" Width="400" />



By changing the value in the color mode drop-down you can control which color model is currently active. As mentioned before, the Color Editor supports four color models - RGB, HSV, HLS

and CMYK.




There are 3 ways to edit the current color.
  1. By dragging the thumb in the color palette.
  2. By editing the values of each color channel.
  3. By editing the hex representation of the selected color.

Let's now examine the more important properties and events the Color Editor exposes:

  • SelectedColor - gets or sets the currently selected color.
  • PreviousColor - gets or sets the previously used color.
  • ColorHistory - provides a collection of previously used colors.
  • HistoryCapacity - gets or sets the maximum number of colors that the ColorHistory can hold.

As a conclusion, we'd like to say that it is in our plans to integrate the

Color Editor into the already available Color Picker

In addition, with one of the upcoming blog posts, we will explain how to visualize the ColorHistory collection so stay tuned for updates!

To learn more about the Color Editor, please visit its documentation page, online examples or simply get the official Q3 2011 bits (WPF / Silverlight) and play with them. Any feedback would be greatly appreciated.


About the Author

Kiril Stanoev

Hi, I'm Kiril and I'm the Product Manager of Telerik UI for Android, Windows Universal and Windows Phone. Feel free to ping me on +KirilStanoev or @KirilStanoev

Comments

Comments are disabled in preview mode.