Want to make your text stand out? Add color in Quickbase!

Subscribe on YouTube

Get more color tips:  HTML/CSS Cheat Sheet
Adding color to the text on Quickbase reports and forms will help the important information stand out! Coloring either the background, the text itself, or both is a sure fire way of grabbing attention.

Do you need to make your form or report text stand out?

If you're looking to do any of the following, you are in the right place!

• Add colored text
• Add color to the text background (aka highlighting text)
• Combine unformatted text with colored text and/or text with a colored background

This training will show you how to add color using the Rich Text Formula field and a little bit of HTML code. There are three main steps to adding beautiful colors to your Quickbase records:

1. Create a Rich Text Formula Field
2. Enter text or field references to be colored
3. Add the HTML span tag with the style element for formatting the text color or background

Three cheers for colored text! Hip Hip Hooray!

For even more eye-popping tips download the HTML/CSS Cheat Sheet for forms. 

RELATED TUTORIAL:  Give your form text 'style' using simple HTML

🎦📚😃 Get more training from Quick Base Junkie

RESOURCES:

Basic format

Background:

"<span style='background: #000000'>Text</span>"

Text:

"<span style='color: #000000'>Text</span>"

Both:

"<span style='background: #000000; color: #00000'>Text</span>"

Format with field reference for text

Background:

"<span style='background: #000000'> " & [Field Name] & "</span>"

Format with field reference for color

Background:

"<span style='background: #" & [Color] & "'> " & [Field Name] & "</span>"

FROM THE TUTORIAL: "Using the rich text formula field and a little bit of code we can easily add color to either the text itself or the background behind the text. For this demonstration, I've set up a Quickbase with a table of all the colors of the LEGOS. Pretty fun right? Well, what I want to do is display instead of the RGB code you see here I want to display the actual color. So that way I can visualize each of these colors very easily. To do that we're going to need to set up a new field. So I'll jump into the settings and add a new field. Just going to call it color and I'll select a rich text formula field. We'll go into the formula. We'll create the formula. It'll take that RGB code or it's also referred to as a hex code and convert that into text that has that same color. To start I'll need to include a double quotation. This indicates a text string. So the code that we're going to enter starts with the span tag. Meaning that everything within this span of text is going to be formatted in a specific way. Within this span we need to define the style let's set that equal to the different elements that we want to style. In this case we want to just style the color. So I'll include a single quotation the word color followed by a colon. And then I'll need to enter a pound sign, followed by my hex code or my RGB code. In this case I want to reference another field, so I'll need to append or join this to that field. That was my RGB code. I'll append this to the rest of my style element, which just requires a single quotation for me to close it out. And then the end or right angle bracket the end of that span tag. And now I can include whatever are the label is that I want to have for this text. The text will be colored but I need to include what text will actually be colored. I'm going to use our color name, so I'll join that to the color name. And then I'll need to close out my span. So I just need to join this now to another string of text that includes a left angle bracket a forward slash the word span and a right angle bracket that's our closing tag for the span element. With all these items set I can now click Save and exit back to our report. All right now you can see we've got all of our colors indicated here with the color name now actually in the color that it's specifying. Now some you don't quite see because, well you got white on white but otherwise it's much more visual to see it this way. Now let's instead flip this and change it to the background color being the color. So go back into that code. I can update color here to now be background and click Save. And now the background is the color. A really cool way to see color stand out on your reports as well as on your forms. Let's go back into that formula for a minute. Now you don't have to just use color codes that are already here and you don't have to just color everything. So for example, if I wanted to include some text that wasn't colored..."

Feeling like a Junkie? Subscribe on YouTube now!