How it works
How it works
- The grid control component allows you to add background colors in different ways:
- Grid control cells can have background colors (gutter remains white). The height of the background can be defined.
- The entire grid control can have background color (including gutter).
- Full bleed (all over) background color can give a generous impression.
- The colors can be chosen from set of colors
How to use it
How to use it
- Use it to accentuate or to establish visual connections.
- Decide if content should be displayed in a close visual context. If yes, use grid background color to avoid white space (see example 1) .
- If you want to clearly separate content opt for background color only for cells, leaving white space in-between. That way, content will be divided visually into independent content elements.
What to avoid
What to avoid
- Do not mix colors in one row. This does not reflect the UBS Brand Design principles.
- Do not place objects with background color (e.g. expandable box) within grid cells with background color.
Reference for publisher
Color selection in grid control component.