Overlays can be used to shade a block. They're typically used in conjunction with a block containing an image wrapped with the "background-image" class. When using an overlay, it's helpful to also set the block's background color with a background color class, so that the block inherits font colors and styles correctly. For example, for a blue background block, use class="blue-bg blue-overlay"

This block is using a gray image as it's background and has a blue overlay.

gray placeholder

This block is using a gray image as it's background and has a dark blue overlay.

gray placeholder

This block is using a gray image as it's background and has a black overlay.

gray placeholder

This block is using a gray image as it's background and has a gray overlay.

gray placeholder