Color-Code a Field

In Quick Base you can About color-coding in reports to a table report, Kanban report, or calendar. You can also color-code individual fields, which can affect reports as well as forms.


Color-coded fields in a report. The Current Priority field is a Formula-Rich-Text field. Its conditional formula says: If Priority is Urgent, make the background red.


Color-coded field on a form.

To Color-code a field

Use a Formula-Rich-Text Field to color a field:

  1. Create or select a Formula-Rich-Text field .

  2. Access the field's properties page.

  3. In the Formula box, enter the formula to color code using a <div> tag. See examples in the table below.

  4. Click Save.

  5. Add the new Formula Rich-Text field to reports and forms.

Tip: You can also color the text in a field instead of the background.

Sample Text Formulas with HTML to color-code field backgrounds

You want to...

Formula

Notes

Show value from the Priority field with the background always in pink.

"<div style=\"background-color:pink;\">"& [Priority]&"</div>"

 

This code will display the value from the Priority field on a pink background.

Wherever HTML calls for a quotation mark, you must precede it with a backslash (\), so Quick Base does not mistake it for the start or end of a literal in the Quick Base formula language. (Read more about literals and the backslash.)

Show the value from the Priority field. Make the background red only if Priority is Urgent.

If([Priority]="Urgent", "<div style=\"background-color:red;\"> Urgent</div>", [Priority] )

or, if you prefer to use a hex value:

If([Priority]="Urgent", "<div style=\"background-color:#FF0000;\"> Urgent</div>", [Priority] )

Black text is hard to see on red. Make text white:

If([Priority]="Urgent", "<div style=\"color:white; background-color:#FF0000;\"> Urgent</div>", [Priority] )

This formula says: If Priority is urgent, enclose the word "urgent" within a div with a red background. Otherwise, just show the value from the Priority field.

Again, wherever HTML calls for a quotation mark, you must precede it with a backslash (\), so that Quick Base does not mistake it for the start or end of a literal in the Quick Base formula language. (Read more about literals and the backslash.)

Color code each value from the Priority field with various shades of red.

Case([Priority], "Urgent", "<div style=\"color:white; background-color:#FF0000;\"> Urgent</div>",
"High","<div style=\"background-color:#FF6666;\"> High</div>",
"Medium", "<div style=\"background-color:#FF9999;\"> Medium</div>",
"Low","<div style=\"background-color:#FFCCCC;\"> Low</div>", "")

Use a Case() function when you're dealing with values in the same field.

White text is appropriate for red but not for the other colors.

 

Related Topics:

 

Go back      |       

© 1999-2018  QuickBase, Inc.  All rights reserved.  Legal Notices.