Link

Usage

Link is a reference to data that the user can follow by clicking or tapping. It can point to a new screen or to a specific element within a screen and can appear inside a text block or as an inline standalone element.

Best Practices

• Link should consist of text that clearly describes either the action that will take place or the location they’ll navigate to.

• Use descriptive text and avoid using generic content such as “click here”

• For the best user experience, links should stand out from the text on the page

Link states

Link states have similar visual cues to Breadcrumb component

• Text is 14px Open Sans Regular and underlined

• Enabled colour is Blue Base, Hover colour is Blue D20, Disabled colour is Grey L40

• Danger colour is Red and Danger focus border is Red L60

• Focus border is Purple L50