ASP.NET MVC ColorPicker Overview
The ColorPicker is part of Telerik UI for ASP.NET MVC, a
professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.
The Telerik UI ColorPicker HtmlHelper for ASP.NET MVC is a server-side wrapper for the Kendo UI ColorPicker widget.
The ColorPicker is a drop-down list for selecting colors.
Initializing the ColorPicker
The following example demonstrates how to define the ColorPicker.
@(Html.Kendo().ColorPicker()
.Name("colorpicker") // The name of the ColorPicker is mandatory. It specifies the "id" attribute of the widget.
.Value("#ff0000") // Set the value of the ColorPicker.
)
Basic Configuration
The following example demonstrates how to configure the tile size, columns, Change event, and palette colors.
@(Html.Kendo().ColorPalette()
.Name("palette")
.Columns(4)
.TileSize(s => s.Width(34).Height(19))
.Palette(new string[] {
"#f0d0c9", "#e2a293", "#d4735e", "#65281a",
"#eddfda", "#dcc0b6", "#cba092", "#7b4b3a",
"#fcecd5", "#f9d9ab", "#f6c781", "#c87d0e",
"#e1dca5", "#d0c974", "#a29a36", "#514d1b",
"#c6d9f0", "#8db3e2", "#548dd4", "#17365d"
})
.Events(events => events.Change("preview"))
)
Functionality and Features
| Feature | Description |
|---|---|
| Appearance | Customize the ColorPicker appearance by using the available options. |
| Views | The component allows you to choose between gradient or palette view types. |
| Contrast Tool | The ColorPicker supports a contrast tool. |
| Formats | Configure the ColorPicker input formats. |
| Palettes | Define a color palette that the user can pick from. |
| Events | The ColorPicker allows you to handle its events and implement any custom logic. |
Next Steps
- Getting Started with the ColorPicker
- Basic Usage of the ColorPicker HtmlHelper for ASP.NET MVC (Demo)