Skip to main content

Looking for the old Design System website? View an archive of the Design System Version 2.

Hero - Split

Overview

A large call to action with a full-bleed background photo.

When to Use

Use when you want to call out important content and have a nice background photo (but maybe not nice enough for a full-bleed).

Content Guidelines

Component
ContentDescriptionMax Chars.
Background Image*A nice background photo.N/A
LabelA general category for the content.N/A
Heading*Short copy that grabs the user’s attention56
SubheadingShort copy that expands on the heading100
Body Copy*A brief (1-3 sentences) description of the content.255
Postscript LinksA list of links to additional resources.N/A

*Required content.

Example 1 General Audience Default Tone Color Palette Option 7

Heading

Lead text.

Here is my copy.
Call to Action

Call to Action