JSFiddle - React, Tailwind, and code Playground

by tonyleeper

HTML

<div class="box" tabindex="0"></div>
<div class="box" tabindex="0"></div>
<div class="box" tabindex="0"></div>

CSS

.box {
  outline: 0;
  border: 3px solid #555;
  display: inline-block;
  width: 100px;
  height: 100px;
  margin: 5px;
}

.box:hover {
  border: 3px solid #aaa;
  cursor: pointer;
}

.box:focus {
  border: 3px solid blue;
}

.box:active {
  border: 3px solid red;
}