Background
Wraps a block of page content in a coloured or photo-backed container so it stands out from the rest of the page.
Use Background when a section of a page needs to read as a distinct block: a hero at the top of a space home page, a coloured callout for a warning, or a tinted panel around a short introduction. You type your content directly inside the macro on the page, exactly as you would anywhere else, and the macro paints a background behind it: a solid colour, a photo, or a photo faded back over a colour. It is the closest thing Capable Formatting has to a "panel", and the shipped templates lean into that ('Info callout', 'Warning panel'). Reach for it when a native Confluence panel is too plain and you want control over height, padding, corner radius, shadow and a background image.
Type | Wraps content on the page |
|---|---|
PDF and Word export | See below |
Published Capable Site | Supported |
Name in the picker | Background (Capable) in the suite. The standalone app usually adds the word macro. |
#See it
The giraffe example below is a real macro on this page, not a screenshot, and its configuration is taken from a page somebody actually built. Open this page in the editor to see how it is set up.
#With images
#Settings
Settings are split across two tabs. Content holds the image, and Style holds colours, layout and appearance.
Setting | Values | What it changes |
|---|---|---|
Image URL | Any image URL, a page attachment, or empty. The field is labelled "Image" and lets you pick a page attachment, paste a URL or search Unsplash. Use the cross to clear it. | Paints a photo across the whole container, behind your content. The photo is scaled to fill the container and follows its rounded corners. With no image, the container is just the background colour. |
Background color | Any colour. The picker offers your brand colours for the Background role, plus a custom colour picker if your admin allows custom colours. | Fills the container. Also shows through wherever the image is transparent or faded by Image opacity, and is the entire look when there is no image. |
Text color | Any colour, from your brand colours (Text role) or a custom colour. | Colours the text of everything you put inside the macro. When no image is showing, the macro may change this colour automatically to keep your text readable. |
Image opacity | 0 to 1, in steps of 0.05 | Fades the background image so the background colour shows through it. At 0 the image is invisible, though it still loads with the page. At 1 it fully covers the colour. |
Image position | Center, Top, Bottom, Left, Right | Chooses which part of the photo stays visible when it is cropped to fit the container. The photo always fills the whole container. |
Side spacing (px) | 0 to 200 | Left and right padding inside the container, between the edge and your content. Does not affect top and bottom padding, which are fixed. |
Text alignment | Left, Center, Right (shown as three icon buttons) | Aligns the text inside the container. |
Height | Wrap, Medium, Large, Custom. | Wrap lets the container be as tall as its content. Medium sets a minimum of 200px, Large 300px, and Custom uses the Custom height value. Any option other than Wrap also adds a little more padding above and below your content. |
Custom height (px) | 50 to 1000, in steps of 10 | The minimum height of the container. |
Border radius | 0 to 16px, set with a slider | Rounds the container's corners. The background image follows the same rounded shape. |
Shadow | None, S, M, L | Adds a drop shadow under the container. |
Border | Off or on. When on, a Width slider (0-6px) and a colour picker appear. | Draws an outline around the container. |
#Related
Give the eye somewhere to land.
