Rivet 1 has been retired and will no longer receive updates. The v1 source code has been archived here. Please migrate to Rivet 2 as soon as possible.
Ready Added in 1.0.0

Links

Inline text links are used to navigate between documents (pages).

Migrating to Rivet 2

This version of Rivet is deprecated. The link component has been replaced by the call to action, link hub, and sidenav components in Rivet 2.

This is a text link on a light background.

This link is Bold link.

<p class="rvt-m-top-remove"> <a href="#">This is a text link</a> on a light background.</p>
<p>This link is <a href="#" class="rvt-link-bold">Bold link</a>.</p>

When to use

  • Navigating to a new page or view in your application
  • Navigating to different web page, e.g. external documentation

When to consider something else

  • Opening or closing a modal or dialog
  • Triggering a dropdown menu
  • Submitting data to the server

Microcopy & accessibility notes

Your link should always describe where it will take users. Users tend to scan text online, and elements that stand out (like links) grab attention. Clear links can help users navigate more quickly.

For example, instead of:

Learn more

Use:

Learn how to reset your passphrase

Never use a link to say “click here.” A nondescript link forces users to backtrack and read the surrounding text for more context. This is even more problematic for those who rely on screen readers, which can list links for quicker navigation. A list of “click here” isn’t helpful for anyone.

Resources

On this page