Inline links

Links can be a text or graphic that is clickable and is used for users to navigate the web, moving within a site or to external related sites through clicks.


A link should have an underline mainly on hover, so the user understands that the link is clickable.

  • The exception is when a link is hard to see in a body text, and in that case the link can be underlined at all time

Do's and don'ts


  • If the background is in a darker color, it’s recommended to have the link in white with an underline. The text should be in a medium size. 
  • Button versus links: In most cases buttons are used for actions and links for navigation. 
  • When a link is used in a flow and has an icon, the icon should be placed in the same direction as the flow. So for example when a user should go through a wizard flow - from left to right. The icon should then be placed on the right side of the link. Otherwise the icon should be placed on the left side of the link. 


  • Don’t use arrows in a list of links, because it can be interpreted as an accordion. 
  • Avoid making links of a complete section of body text


  • Link: Dark blue 2, medium
  • Hover: Dark blue 2, underlined