Highlighter

Our layout system has been created to improve legibility and effectiveness of messaging — The highlighter should only be used when the legibility of the headlines is compromised on busy photographic backgrounds. We never use the highlighter on block colour or textured backgrounds.

The highlighter can only be implemented in the core blue palette. Secondary colours can only be used to highlight price points or CTAs.

The highlighter applies to both elevated and impactful type. See section about typography on placement and scale.

The highlighter can be used in both low and high funnel applications to improve the legibility of headlines.

You can generate the highlighter automatically in InDesign, or create it manually in the programme of your choice:

Use this method to build the highlighter automatically in InDesign using the Underline Options panel.
Type size: X Underline weight: X*1.2 Underline offset: -X*0.3

Example settings in InDesign:
Type size: 100pt Underline weight: 120pt Underline offset: -30pt
Always place an extra space at the beginning and end of every line of type.

Use this method to create the highlighter manually using a grid.
x equals the headline ascender height.
There should be a margin of x/3 above and below each line of type.
There should also be a margin of x/3 at the end of every line of type.

Here are some examples of the highlighter in use in high funnel applications.

Here are some examples of the highlighter in use in high funnel applications.