Skip to end of metadata
Go to start of metadata

Description

The Background Color macro allows the changing of the background color of content. 

At times it might be required to highlight a block of content to make it stand out on a page, and that's exactly what this macro does.

Any background color can be specified using either color names or their hexadecimal color codes.

Usage

Click Insert > Other Macros.

 

Select the Background Color macro from the provided list.

 

Complete the desired fields.

ParameterDescriptionType

Default

Required?
Color

The background color for the content contained within the macro and can be either a common color name (supported by most browsers) or a hexadecimal color code (supported by all browsers).

string

green

(tick)

CSS ClassSpecifies a CSS Class to be added.stringnone(error)

 

The macro will then appear on the page, with space to add content into the body of the macro.

 

Examples

Standard Use

There are several built-in pastel colors ideal for use as backgrounds:

With Color parameter set to red, yellow, green, cyan, blue and purple respectively.

Which results in:

red
yellow
green (default)
cyan
blue
purple
 

 

Using standard browser color names, except those shown above, to display additional colors.

With Color parameter set to orange and violet respectively.

Which results in:

orange
violet

Hexadecimal Color Code

To be specific about the color displayed, use a hexadecimal color code:

With Color parameter set to #003366.

Which results in:

Slate blue

When changing background color, please try and keep a contrast between the text and the background so that it is still clearly readable. In our example above, the slate blue background made the black text barely readable.

 

You may also want to change the text color using the color macro. Simply change the text color from the Confluence text toolbar menu.

 

Which results in:

Slate blue
 

Frequently Asked Questions:

Q

Can I highlight just a few words within my text, rather than a whole block of content?

A

Yes. Use the highlight macro.

Q

I'm using hexadecimal codes, but they are not working - why?

A

Unlike the color macro, this macro requires the "#" at the start of the number.

Q

Where can I get HTML text color codes from?

A

WebMonkey has a good color code reference page that shows each of the standard colors with the corresponding color code. If you want a groovy wall chart with color codes, try http://html-color-codes.com/.

Q

Some color names, such as "grey", don't seem to work in all browsers - why?

A

Color names are supported differently by different browsers. To be 100% sure of getting the right color, use the hexadecimal color code instead.

Q

How do I change the color of text?

A

Use the confluence text toolbar.

Q

How do I change the default background color of my page, etc?

A

If you are using a standard theme, there are some limited options to change colors. If you are using the Builder Documentation theme, you have complete control over all colors using Builder CSS Custom Styles.

Q

Can I put a graphic in the background?

A

Yes. The Div and Style Sheet allow you to apply far more customized formatting to content.

 

 

Top of page

  • No labels