Colors

UI Color System

Colors in InsuranceSuite can be applied manually or with themes.

Manual Method

Some widgets have PCF fields that allow a color to be entered.

  • Some allow the direct entry of a color value, such as a CSS3 name or a hex value.
  • Other widgets require an instance of GwColor. GwColor is a java class with a number of helper methods for adding color. Manually adding the color GwColor.createFromHex(#0000FF) or GwColor.createFromCssLevel3Color('blue') to a PCF field causes that field to be blue.

Theme Method

Guidewire applications include multiple themes. The idea is to specify a concept and then allow each theme to translate that concept into a color that makes sense in a specific context.

The simplest way to apply colors in this way is to use the GwColor static instances, such as GwColor.THEME_NUMBERS_NEGATIVE or GwColor.THEME_OUTCOME_POSITIVE. Using these instances causes the widget to have a CSS class that is then changed per theme. For example, 'positive' might be a very light green color in the 'dark theme', or a darker green in the 'blue theme'. Typing GwColor.T shows an autocomplete drop-down with all ofthe options. Developers can also see the static references directly in GwColor.java.

The GwColor THEME instances are mapped to Sass color values in platform_colors_themeable_in_pcf.scss.

Many colors visible in the application but not exposed directly in PCFs, like button colors or the color of the left navigation panel, can all be changed and themed directly in Sass files.