Using the Color Selector

The Color Selector enables you to select or create colors to apply to themes, forms and dashboards.

The Color Selector opens when you:

  • Select the Add Color button in the Theme Editor.
  • Select a color to edit in a theme color swatch.
  • Select a color to edit in a theme state override swatch.
  • Select one of the following in a designer:
    • Form or dashboard Background Color.
    • Background Color.
    • Foreground Color.
    • Border Color.

You can use an existing color or create a new color by selecting one of the following:

  • Reference: Select an existing reference color from the list.
  • Web: Select and existing web-safe color from the list.
  • Palette: This list is shown when editing a state override color only. Select an existing palette color from the list.
  • Custom: Use the controls and fields in this section to create a new color.

Using the Color Selector in the Theme Editor

To use the Color Selector when creating or editing a theme.

  1. Open the Theme Editor.
  2. Hover the mouse pointer over a color on a color swatch and select Edit.
  3. Select a color from the available color lists, or create a new color using the controls in the Custom section.
  4. Select Apply.

Using the Color Selector in a Designer

To use the Color Selector when creating or editing a form or dashboard.

  1. Open the designer (form or dashboard).
  2. Select an element or background.
  3. The Color Selector can be opened in several ways:
    • Select the form / dashboard Background Color to change the background color.
    • Select an element, then select the element Background Color to change an element's background color.
    • Select an element, then select the element Foreground Color to change an element's foreground color.
    • Select an element, then select the element Border Color to change an element's border color.
  4. Select a color to apply from the Theme Association drop-down list:
    • Select an existing color from the list.
    • Select (Custom) to display the custom color controls:
      • Select a color from the available lists (example: Web).
      • Select Custom and use the color controls to create a custom color.
  5. Select Apply.