Close

Hero image

Large impactful images that span across the browser on any device

This is the caption. Displaying a caption underneath hero images is optional. The hero image above is set to display height: "tall".

Hero images sometimes get cropped

Hero images work best with higher resolution images, and when the subject and style of the image helps to make impact. Its important to understand that on some devices, areas of the image might be cropped and invisible, so don't use a hero image to communicate important details to the audience, as these details may not be seen at all. Avoid text as part of hero images for the same reason.

Hero images can be used at two different sizes. The example above uses the exact same image file as the top example, but it has been set to display height: "short"