RGB and HEX Input Formats

With R3 SP1 of 2021 release support for both RGB and HEX formats for the Telerik UI for ASP.NET Core ColorPicker was introduced. The available input formats for the component can be specified through .Formats() configuration. to choose the default format, use the .Format() option.

The example below demonstrates how to configure the Telerik UI for ASP.NET Core ColorPicker with a different default view:

    <div>
        <h3><label>HEX ColorPicker</label></h3>
        @(Html.Kendo().ColorPicker()
            .Name("HexPicker")
            .Format(ColorPickerFormat.Hex)
            .Formats(new string[] { "rgb", "hex" })
        )
    </div>
    <div>
        <h3><label>RGB ColorPicker</label></h3>
        @(Html.Kendo().ColorPicker()
            .Name("RgbPicker")
            .Format(ColorPickerFormat.Rgb)
            .Formats(new string[] { "rgb", "hex" })
        )
    </div>

@{
    string[] formats = new string[] { "rgb", "hex" };
}

     <div>
        <h3><label>HEX ColorPicker</label></h3>
        <kendo-colorpicker name="HexPicker" 
         format="ColorPickerFormat.Hex"         formats="formats">
        </kendo-colorpicker>
    </div>
    <div>
        <h3><label>RGB ColorPicker</label></h3>
       <kendo-colorpicker name="RgbPicker" 
         format="ColorPickerFormat.Rgb"         formats="formats">
        </kendo-colorpicker>
    </div>

See Also

• RGB and HEX formats of the Telerik UI for ASP.NET Core ColorPicker (Demo)
• Server-Side API
• Client-Side API