| Panel | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
| Panel | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
A Link is a basic navigational element that allows users to navigate through your website or application. They may appear on their own, within a sentence or paragraph, or directly following content.
| Table of Contents | ||||||||
|---|---|---|---|---|---|---|---|---|
|
Usage
| Tip |
|---|
Do’s
|
| Warning |
|---|
Dont’s
|
Links vs Buttons
Links and buttons have different behaviours and generally have distinct visual styling that differentiate from each other.
There are clear use cases that help you decide whether a link or a button is the appropriate interactive element:
| Panel | ||
|---|---|---|
| ||
Links
|
| Panel | ||
|---|---|---|
| ||
Buttons
|
Links that look like buttons
In some cases links are styled to look like buttons to increase their prominence and align their styles with other interactive elements of a webpage. This should be avoided as much as possible, although design and brand choices sometimes make this difficult. Use your best judgement when designing links considering the information here, and across the we.
Anatomy
<insert image here>
| Item | Component type | Content type | Notes | ||||||
|---|---|---|---|---|---|---|---|---|---|---|
1 | X | X | X |
|
Visual style
<explain different types of links>
<Explain size>
Primary
Secondary
Subtle
Nav
Selector
Retailer
Heading
Editorial
Behaviour
Accessibility
| Note |
|---|
To be added:
|