Overview
The Group Block is a useful way to keep certain elements or sections of your page together. Think of it as a “Parent” Block that holds “Child Blocks” together in one space. Within the Phillips 66 theme, editors can select different background colors. These colors should be used thoughtfully to differentiate content on a page. Please review the blocks that you place within each colored group to ensure that the background does not clash.
White
By default, a Group has no background color, which means that it is transparent. If you would like your content to always sit on top of a white background, ensure that you have White selected.
Group on White Background
Here is the text that sits on top of the white background. Here is the text that sits on top of the white background. Here is the text that sits on top of the white background. Here is the text that sits on top of the white background. Here is the text that sits on top of the white background. Here is the text that sits on top of the white background. Here is the text that sits on top of the white background.
Extra Light Gray
Group on Extra Light Gray Background
Here is the text that sits on top of the extra light gray background. Here is the text that sits on top of the extra light gray background. Here is the text that sits on top of the extra light gray background. Here is the text that sits on top of the extra light gray background.
Light Gray
Group on Light Gray Background
Here is the text that sits on top of the light gray background. Here is the text that sits on top of the light gray background. Here is the text that sits on top of the light gray background. Here is the text that sits on top of the light gray background. Here is the text that sits on top of the light gray background.
Black
The black background should be used sparingly, but there are some pre-defined Patterns which utilize the black background. Notice that the text color automatically updates to white.
Group on Black
Here is the text that sits on top of the black background. Here is the text that sits on top of the black background. Here is the text that sits on top of the black background. Here is the text that sits on top of the black background. Here is the text that sits on top of the black background. Here is the text that sits on top of the black background. Here is the text that sits on top of the black background. Here is the text that sits on top of the black background.
Red
The red background should only be used with prior approval in rare and standalone circumstances.
Group on Red
Here is the text that sits on top of the red background. Here is the text that sits on top of the red background. Here is the text that sits on top of the red background. Here is the text that sits on top of the red background. Here is the text that sits on top of the red background. Here is the text that sits on top of the red background.