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.

Button

Buttons allow a user to take an action.

Typography

A standard set of typographic styles enables a clear visual hierarchy in designs.

CONTENTS