Change Table Headers or Cells Colors and Format
Required Permissions
This section requires the Application Designer permission from your Domain's administrator.
Check What are the Design Tasks? to learn more about permissions to work with Design Mode and other tools.
Learn how to customize the table's columns and cells appearance. In Design Mode, you can customize the headers and text's colors. Also, you can customize the cell's format and font.
Follow the steps below to change either the header or cell or table's text colors in your application.
-
In Design Mode in the main panel Table, click on Layout in the left sidebar. The action leads to the sub-panel where you can customize the colors.
-
In the Layout panel, click on the tab of the table you want to customize.
-
In the corresponding tab, you find the table's list of visibile fields.
Choose the element that you want to customize on the table.
-
(1) Click on the corresponding Header Colors Bg button to customize the header's background color for the selected field column.
-
(2) Click on the Header Colors text button to customize the header's text color for the selected field column.
-
(3) Click on Cell Color Bg button to customize the cell's background color for the selected field column.
-
(4) Click on Cell Colors text to customize the cell's text color for the selected field column.
If you want to customize the entire Row Color, (1) click on the Toggle Advanced Settings and on (2) Row Colors > Background.
Choosing the element to customize by clicking the corresponding button opens the Color Settings window.
-
-
In the Color Settings window for the selected field column's element, choose a color from the default list (1) or define one through the palette (2).
As alternative, click Set Formula to define a Formula defining what color to display. The action opens the Formula Editor to insert a Formula. The element's color will change according to the formula's condition. (Click on Clear Formula to remove the formula managing the colors.)
Example
If you want to know more about how Formulas can manage colors, see the case Cell Changes Color When You Record an Expense or Earnings in the Formulas Use Cases.
-
Click on Confirm to confirm the changes. (Click Reset Default to reset the element's color settings to the default. Click Cancel to abort the changes.)
The chosen color will appear as preview on the corresponding element's color button.
If you have configured a formula managing the colors, F(x) appears on the element's color button.
-
You can change the cells' format for the column.
Under the Formatting column, you can choose for each field a font to format the cells.
Click on the drop-down list and choose one of the available fonts.
Click on one of the styles available for formatting: Bold (), Italics (), and Strikethrough ().
Choose a text alignment for the column's cells' text.
Click on the icon. The action opens a drop-down list menu with the available text alignments: Centered, Right, Left, and Justified. Choose one. The icon will change according to the selected alignment. (By default, the fields are aligned to the left, exception made Numeric-type fields, Lookup drop-down list, and RTF-type fields. Numeric are Right aligned. Lookup drop-down list menu are Center aligned. Formatting of RTF fields depends on the RTF format and not the Layout panel.)
-
Click on the Save button to save the changes made. You find the Save button in the upper-left corner of the Design Mode.
Tip
You can copy & paste a field's colors, font, style, and text alignment in the Layout panel.
- Click on the icon on the field to copy its font, style, colors, and alignment.
- Click on the icon to paste the copied font, style, colors, and alignment on the field.
Tip
You can preview the final result by turning on the Toggle Advanced Settings toggle switch.
The action opens a sub-menu displaying a preview of the headers and columns including the colors.
Success
You have customized the table's header and cells appearance.