Select a Background, Foreground, and Border Color for a Control

Use the Form Editor (accessed from within a Blueprint in CSM Administrator) to select a background, foreground and border color for the controls on a form.

This topic describes defining and formatting control colors on a form with a universal theme. If you are editing a form with a classic theme, use this link to open the previous version of Select a Background, Foreground, and Border Color for a Control.

By default, defined theme colors are applied to a control when the control is added to a form. You can manually apply different colors, if needed. We recommend always using theme colors.

Good to Know:

  • Form theme colors are defined as part of a theme's definition. Use the Theme Manager to create a theme.
  • Each theme property is named and intended for a specific element on a dashboard, form, portal or action catalog. When the element is added, the item's defined colors, styles, and fonts are applied by default (example: Form control colors, border style, and fonts are automatically applied to a control when the control is added to a form). Manually apply a different color or style to most elements, if needed. The key is to use theme colors, and to apply colors and styles consistently. If a non-theme color is applied, the element does not change to another theme color when applying a different theme.
  • Background, foreground, and border color options are available on the Form Editor toolbar and context (right-click) menu.
  • CSM Desktop Client and CSM Administrator, transparent colors are displayed white and opaque colors are displayed as a solid color when applied to a background for the following form control types:
    • Text
    • Number
    • Date/Time
    • List
    • Matrix Selector
    • Related Item Picker
    • Combo Box
  • State override (conditional) theme colors can be applied to functional controls on a form to conditionally change the background, border or text color of a control (example: Save button, a disabled button, a disabled feature or controls containing read-only text).
  • See Form Editor Behaviors for tips on working with controls and the Form Editor.

To select a background, foreground, or border color for a control:

  1. Open a form in the Form Editor.
  2. Select one or more controls.
  3. On the Form Editor toolbar, select the Background Color button , the Foreground Color button , or the Border Color button .

    You can also use the context (right-click) menu to select these functions.

    The Color Selector dialog opens. For more information, see Color Selector

  4. Select a color, either:
    • Select a theme color: Select a pre-defined theme association color property from the Theme Association drop-down list (example: Primary Button Background).
    • Select or define a custom color: Select Custom from the Theme Association drop down list, and then either:
      • Select the Web tab, and then select a color from the list.
      • Select the Custom tab, and then define a color using the Color Selector controls.
  5. Select Apply.
  6. Publish the Blueprint to commit the changes, or save the Blueprint to continue making other changes.