Color Selector Control in Silverlight

Silverlight Color Selector Control

This Color Selector control provides the user with a simple way to select from a list of pre-defined colors.

This Silverlight only Color Selector Control is easy to implement on your Silverlight driven website and is also customizable to provide a visual feel suitable for any site design.

If you want use Color Selector Control you will need to add a reference to Liquid.dll in your application.

Download a from top of the article.

Creating a ColorSelector Control

The ColorSelector element represents a ColorSelector control in XAML.

<liquid:ColorSelector />

The Background property represents a Background color of the ColorSelector. The BorderBrush Propoerty represents a Border of the ColorSelector, X:Name property represents a name of the ColorSelector.


The code snippet creates a ColorSelector control and sets the Background, BorderBrush and X:Name Property.

<liquid:ColorSelector Background="Black" BorderBrush="Blue" x:Name="selectColor" SelectionChanged="selectColor_SelectionChanged" />


<UserControl x:Class="SilverlightColorSelector.Page"
    Width="400" Height="300">
    <Grid x:Name="LayoutRoot">
        <liquid:ColorSelector Background="Blue" BorderBrush="Green" x:Name="selectColor" SelectionChanged="selectColor_SelectionChanged" />


using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SilverlightColorSelector
    public partial class Page : UserControl
        public Page()
        private void selectColor_SelectionChanged(object sender, EventArgs e)
            LayoutRoot.Background = new SolidColorBrush(selectColor.Selected);

The output is :

Figure 1

If you select any color like Blue the Result is :

Figure 2

In this article, I discussed how we can use a silverlight color selector control.