A collection of WPF controls that let users choose colors in various ways. Originally developed for PixiEditor. Supports .NET Framework 4.5+, .NET Core 3.1+, and .NET 5
SquarePicker: A HSV/HSL Color Picker, consists of a circular hue slider and HV/HL square.
ColorSliders: A set of HSV/RGB + Alpha sliders
HexColorTextBox: An RGBA Hex text field
ColorDisplay: A Primary/Secondary Color display with a swap button
StandardColorPicker: Combines everything listed above in one control
PortableColorPicker: A collapsible version of StandardColorPicker
AlphaSlider: A separate alpha slider control
See ColorPickerDemo for an example project.
Install the NuGet package, insert a reference to the ColorPicker namespace
Add the controls
Note: in some configurations such as using the package in .NET Framework 4.7 XAML designer breaks and doesn't show the control. In my testing that did not affect the build process.
All controls share these properties:
ColorStatedependency property contains all info about the current state of the control. Use this property to bind controls together.
Colorproperty contains nested properties you may bind to or use to retrieve the color in code-behind:
Color.A: Current Alpha, a double ranging from 0 to 255
Color.RGB_B: Dimensions of the RGB color space, each is a 0-255 double
Color.HSV_H: Hue in HSV color space, a 0-360 double
Color.HSV_S: Saturation in HSV color space, a 0-100 double
Color.HSV_V: Value in HSV color space, a 0-100 double
SelectedColordependency property stores the current color as System.Windows.Media.Color
ColorChanged: An event that fires on SelectedColor change.
Apart from those, some controls have unique properties:
SecondaryColorare functionally identical to
SelectedColorrespectively. Those are present on controls that have a secondary color.
SmallChangelets you change
SmallChangeof sliders, which is used as sensitivity for when the user turns the scroll wheel with the cursor over the sliders. Present on controls with sliders.
ShowAlphalets you hide the alpha channel on various controls. Present on all controls containing either an alpha slider (apart from the
AlphaSlidercontrol itself) or a hex color textbox.
PickerType: HSV or HSL, present on
SquarePickeror controls that contain
Out of the box, the color picker uses the default WPF look:
You may use the included dark theme by loading a resource dictionary in XAML:
and referencing DefaultColorPickerStyle in the style attribute of a control:
As an alternative, the same can be achieved programmatically:
You may define your own styles, see DefaultColorPickerStyle for reference.
Read flabbet's article on the theory behind the first version of this project on dev.to