Design a Theme
Good Theme design is important. Before creating a Theme, consider the following:
- Each Theme property is named and intended for a specific element on a Dashboard, Form, or Portal. 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. For example, it is possible to use Form Background Color 1 for text. The key is to use Theme colors, and to apply colors and styles consistently. If a non-Theme color (example: System, Web, or RGB) is applied, the element does not change to another Theme color when applying a different Theme.
- Contrast is important, so we recommend considering the background and label colors first. If background colors are dark, use lighter label and accent colors. If background colors are light, use darker label and accent colors.
- Consider accessibility (example: Color blindness), translation (example: What does a color mean in another locale?), browser capabilities (example: Do browsers consistently display the color?), and science (example: What does the color evoke?) when selecting a color. Colors should please, not irritate.
- Transparent is a color option. Use transparent on backgrounds and borders when a color is not needed.
- Widgets significantly vary by
type, so Theme
properties and how they can be applied also significantly vary:
- By default, Widget labels inherit their font from the default system font. Font size, style, and alignment must be manually applied.
- Chart, Gauge, and Matrix Widgets can have their own colors and styles and can be defined to override Theme colors.
- Theme Alert colors are automatically applied to gauge thresholds (example: Low, Medium, and High). Override Theme Alert colors, if necessary or apply Theme Alert colors to other elements (example: Alert colors are often used in Expressions to conditionally change a Widget's background or label color).
- Image, Button, Filter, and Search Widgets do not support backgrounds; therefore, no background color or style can be applied.
- Image Widgets do not support text, background, foreground, or border colors; therefore no colors, styles, or fonts can be applied.
- By default, Text Gauge Widgets have a transparent background. To manually add a background, right-click the Widget, select a background style, and then select a background color and border color.
- The Rich Text Editor uses a default font based on the following settings, shown in priority order:
- Field Properties for a specific Field in a Business Object (example: Resolution fields in Problems).
- Default font selected in the Global Rich Text settings.
- Default Theme Form control font.
- CSM
- CSM global system font (not configurable)