GH-Elements

Color

Color is a gh-element that allows users to select different colors and save them in the application.

Functional Characteristics

The Color element is used to set the color of the items in calendar, sheduling, task board, Google map, filter tabs, and view tabs. It can also be used in online stores to set the color of the product.

Value Format

Color value is a string type data with a hexadecimal code of the selected color.

{
    "field_value": "#ffffff"
}

Color picker

Color picker is an interactive window that allows to select value of the color. It has modes:

  • Standard mode contains a set of 20 different colors.

    Color picker standard mode

  • Advanced mode allows to select any color from RGB color wheel and get it hex code.

    Advanced mode of the color picker

It is available only for Input With Name interpretation type.

More information about color picker in Setting Overview article.

Element Options

Color element has not variety options. You can only configure its field settings.

Field Settings

In field values you can set standard options and default mode.

Field settings of the color

Name Description
Advanced mode by default allows to use advanced color settings as a default mode

Advanced mode by default

This option allows to set a default mode of color picker. If it is false, the standard mode will be default. And if has false value, the picker have the advanced mode as a default.

Element Style

Style of the color element can be configures with help of standard options about that you can read in Setting Overview. Also, here you can configure its interpretation. Read more about it below.

Style of the color element

Data Model

Color data model contains only two properties.

{
    "data_model":{
        "advanced_mode_by_default": 1,
        "interpretation": []
    }
}
Name Type Description
advanced_mode_by_default boolean shows whether the advanced mode is used as a default one
interpretation array contains all color interpretations

Filtration

Despite that color value is a string, color element supports filtration by only Value filter.

Interpretation

Color has only two interpretation types.

Types of the color interpretation

Input With Name

This is a type of interpretation that allows you to display the selected color in a small circle and open an interactive window after clicking on it.

Hex

This interpretation displays the hex code of the selected color and do not allows to edit this value.

Value

Through this type of interpretation, the value of the field is displayed.