CTA Buttons and links

Call to action (CTA) buttons and links are used to help users carry out an action or navigate around our experiences.

Purchase CTAs

We reserve BT Pink for links and CTAs that lead through to purchase and upgrade journeys only. Try not to use this colour elsewhere on the page. This creates a simple, clear visual language for users that make it easier to see how to purchase or upgrade.

Examples of purchase and upgrade CTAs

States and interactions
 

Use on coloured backgrounds

Primary & secondary combinations

Learn CTAs

BT Purple is used for CTAs and in-page interactions that help our users to navigate and explore BT’s content. It is also our standard hyperlink colour.

If a hyperlink is inserted into body or paragraph text, is should always be underlined to make the link obvious and to adhere to accessibility guidelines.

Examples of learn and explore CTAs

States and interactions

Use on coloured backgrounds

Primary & secondary combinations

 

Links within text

Links within text are embedded into the copy as follows:

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

Button specifications

Buttons have a set height of 40px, with padding left and right of the text set to 20px. Corners have a radius of 5px. The minimum width of the whole button is 80px.

Secondary buttons have a 1px keyline. The link style has chevrons the same size as the ‘x’ height of the font, and are placed 10px to the right.