<p class="instructions">
  (click here and <code>TAB</code> to the div, or
  click it with your mouse)
</p>
<div tabindex="0">
  Click Me!
</div>

/* Copyright 2018 Google LLC.
SPDX-License-Identifier: Apache-2.0 */

body {
  font-family: "Benton Sans", "Helvetica Neue", helvetica, arial, sans-serif;
  margin: 2em;
}

.instructions {
  margin: 8px;
}

div[tabindex="0"] {
  border: 1px solid black;
  display: inline-block;
  padding: 8px 16px;
  cursor: pointer;
}

div[tabindex="0"]:focus {
  outline: 4px dashed orange;
}