Links take people to another place, and usually appear within or directly following a sentence.
Figma
The Figma reference for Link will appear here once the design link is added.
Storybook
Interactive examples for Link will render here once the Storybook link is wired in.
Best practices
- Use links primarily for navigation; use buttons for actions such as “Add” or “Save”.
- Use standard (same-tab) links whenever possible to avoid disorienting people.
- Open a new tab only when necessary — for example, when leaving the current workflow or product entirely.
- Write clear link text; avoid decorating links with an external icon inside a sentence.
Do’s and don’ts
Do
Use descriptive link text that makes sense out of context: “view inspection report”.
Don’t
Link vague text like “click here” or “read more”.
Accessibility
- Rendering a link (an anchor) vs. a button carries meaning for assistive technology — use each for its intended purpose.
- If a link opens in a new tab, make that predictable through clear text and placement.