style.css
index.html
a { color: green; }
/* :focus is triggered always. */
a:focus { outline: none; }
/* :focus-visible will only trigger on keyboard tab through */
a:focus-visible {
outline: 0.1rem solid currentColor;
outline-offset: 0.2rem;
border-radius: 0.1rem;
}
<!DOCTYPE html>
<html>
<head>
<title>Pseudo-focus</title>
<link href="style.css" rel="stylesheet">
</head>
<body>
<p>This is a paragraph with <a href="#">a link</a> in it.</p>
<p>And another one with <a href="/topic/css">another link</a>.</p>
</body>
</html>