Core Framework v2.1.0 – Documentation

Links With Visited State

Default links are always displayed in blue, regardless of whether the user has or hasn't already visited the linked resource.

If you need to give users an explicit hint about which of your links they've already been to, you can activate the violet visited state with the link-visited class.

Usage

To make an individual link show a visited state, apply the link-visited class to it. You can also give a visited state to multiple links by applying the class to a common ancestor element.

Note: When using the nested version, it is always a good idea to apply the link-visited class as precisely as possible to avoid unintended side effects with non-standard links.
Buttons (anything with button in the class name) and disabled links (disabled) are specifically excluded from this behavior. Any other special links may end up looking buggy.

Links with and without visited states (You may need to click one of them initially to see the effect.) 
<a href="#">
    Standard link
</a><br />
<a href="#" class="link-visited">
    Link with visited state
</a>

<section class="link-visited margin-bottom">
  <h1 class="font-l">
    <a href="#">These</a>
  </h1>
  <nav>
    <ul>
      <li><a href="#">Links</a></li>
      <li><a href="#">All</a></li>
    </ul>
  </nav>
  <a href="#">have a</a>
  <a href="#">
    <h2 class="font-m">Visited</h2>
  </a>
  <p>
    <a href="#">state</a>.
  </p>
</section>
<a href="#">This one does not</a>.