<h1>Tab through the links!</h1>

<a href="#">We have an outline! &#128512;</a>
<a href="#">You know which link you're on.</a>
<a href="#">It's accessible!</a>

<hr />

<a class="no-outline" href="#">We don't have an outline &#128549;</a>
<a class="no-outline" href="#">Which link are you on right now?</a>
<a class="no-outline" href="#">You don't know?</a>

<hr />

<a href="#" class="fancy-link">We have an outline! &#128512;</a>
<a href="#" class="fancy-link">You can customize the oultine.</a>
<a href="#" class="fancy-link">Now I can fit your theme.</a>

.no-outline {
  outline: none;
}

.fancy-link:focus {
  outline: 2px dashed red;
}