Back to all examples

Link to an external page

ReactAngularWeb Components
<GoabLink trailingIcon="open">
      <a href="#external-url">External link</a>
    </GoabLink>

Use an external link indicator to show users when a link will take them to a different website.

When to use

Use this pattern when:

  • Linking to websites outside your service
  • Users should be aware they’re leaving the current site
  • Providing references to external resources
  • Following accessibility best practices for external links

Considerations

  • Use the “open” trailing icon to indicate external links
  • Consider whether the link should open in a new tab
  • Ensure the link text clearly describes the destination
  • External links should be used sparingly and with purpose