Change Table Headers or Cells Colors

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 header, cells, and table's text colors of the application's tables.

Follow the steps below to change either the header or cell or table's text colors in your application.

  1. 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.

  2. In the Layout panel, click on the tab of the table you want to customize.

  3. 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 Bg Color button to customize the header's background color for the selected field column.

    • (2) Click on the Header Text Color button to customize the header's text color for the selected field column.

    • (3) Click on Cell Bg Color button to customize the cell's background color for the selected field column.

    • (4) Click on Cell Text Color 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.

  4. 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).

    Hint

    You can insert a HTML Supported Code to specify a particolar color shade in the palette.

    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.

  5. 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.

  6. Click on the Save button to save the changes made. You find the Save button in the upper-left corner of the Design Mode.

Hint

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, cells or text colors.