Color Picker

    Alias: Umbraco.ColorPicker

    Returns: String (Hexadecimal)
    Returns: Umbraco.Core.PropertyEditors.ValueConverters.ColorPickerValueConverter.PickedColor (When using labels)

    The Color picker allows you to set some predetermined colors that the editor can choose between.

    Data Type Definition Example

    Content Picker Data Type Definition

    Content Example

    Content Picker Content

    Example with Modelsbuilder

    @{
        var hexColor = Model.Color;
        String colorLabel = Model.Color.Label;
    
        if (hexColor != null)
        {
            <div style="background-color: #@hexColor">@colorLabel</div>
        }
    }
    

    Example without Modelsbuilder

    @using Umbraco.Core.PropertyEditors.ValueConverters
    @{
        var hexColor = Model.Value("Color");
        var colorLabel = Model.Value<ColorPickerValueConverter.PickedColor>("Color").Label;
    
        if (hexColor != null)
        {
            <div style="background-color: #@hexColor">@colorLabel</div>
        }
    }