COMPONENTS
Link
Link allows for the styling of hyperlink text.
Link has two core types — inline or standalone.
Link can have either subtle or bold emphasis. Bold emphasis should be used for inline links to ensure the link is visible.
Standalone links can have a leading or trailing icon. Icons should be sized to the same height of the link text and use the text-link color token.
Link has four states — default, hover, active and visited.
Link has three sizes — small, medium and large. Each size maps to a base style in the typography tokens.
- When inline, link size should match the type size of the text in that line or paragraph.
- Standalone links should use a text size that is complimentary to the content near it.
DO: Keep the size of the link the same as the text size in the same line or paragraph.
DON'T: Use a larger or smaller size for inline links.
CONTENTS