Interface design: Text + image

A marketing component that presents content next to a hero image.

Component variations

The text + image component has 32 different display variations. Variables include alignment, text styling, background colour, one image, two images and optional buttons.

Left aligned, no background

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Left aligned, no background

Right aligned, no background

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Right aligned, no background

Left aligned with background

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Left aligned with background

Right aligned with background

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Right aligned with background

The intro style and two image version are available in the same alignment and background colour options.

Intro style

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Intro style

Two images

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Zeplin examples