Gradient Backgrounds

You can use gradient backgrounds to help with your website design. These are typically used within featured content banners and cards.

Linear gradients

Primary

Highlight

Standout

Secondary

Primary-standout

Primary-highlight

Primary-secondary

Standout-highlight

Danger-warning

Info-success

Primary

Highlight

Standout

Secondary

Primary-standout

Primary-highlight

Primary-secondary

Standout-highlight

Danger-warning

Info-success

Radial gradients

Gray

Gray Light

Primary

Highlight

Standout

Secondary

Secondary light

Gray

Gray Light

Primary

Highlight

Standout

Secondary

Secondary light