Examples

2x2 Information box layout with image, introduction text and text link.

Information box hero with half SVG and half body copy

Twitter feed automated to pull in specific twitter feeds from different areas of the company (e.g. Adviser, Workplace, 1825).

Information box with a blue and white column like a table

Infobox component with image and CTA link using bootstrap/digital framework utilities

Card component with image, three column layout using bootstrap/digital framework utilities

Information box with body copy and a download links

Download link with an icon font to the left of the link.

Form input with a tooltip inline

Accordion with grey dropdown icon.

Typography Heading with an Illustration to the left of the heading

Hero component with embedded video and transcript accordion

Information box with an icon list inside it as content.

Hero in a grid container with body copy to the right and an illustration to the left. The illustration is removed for small screen devices.

Infobox component two row, two colum layout using bootstrap/digital framework utilities

Infobox with thick border, heading, SVG icon, description and CTA link using bootstrap/digital framework utilities

Infobox component column layout with SVG illustration using bootstrap/digital framework utilities

Infobox with thick border, heading, ribbon, description and CTA link using bootstrap/digital framework utilities

Important infobox component with font icon using bootstrap/digital framework utilities

Infobox component using bootstrap grid to create four row layout using bootstrap/digital framework utilities

Three column infobox multiple CTAs layout using bootstrap/digital framework utilities

Infobox component with utility class to change background colour using bootstrap/digital framework utilities

Information box with an infographic inside it.

Information box using border radius and background colour utilities.

Infobox component grid layout, with heading, description and CTA link using bootstrap/digital framework utilities

Information box using the utilities to create a list group.

Word wrap on navigation bar, for longer section titles

Information box with 5 star content inside

Links to blog posts with background image and title. Mark up below shows the mark up for one card, not all three.

Information box with SVG signpost and body content.

Information box using the border width utility. This can be changed 1-10 at any breakpoint.

Tile notification component row layout using bootstrap/digital framework utilities

Information box with a blue top border and 3 responsive columns of content below.

Video hosted by JW Player embedded on a page.

Information box with a yellow background colour and illustration.