<span class="btn">ここをクリック!</span>
body {
  padding: 64px;
}

.btn {
  padding: 16px 32px;
  background: hsl(190, 78%, 46%);
  color: #fff;
  border-radius: 10px;
  box-shadow: 10px 7px 5px silver;
  cursor: pointer;

  transition: background .5s;
}

.btn:hover {
  background: hsl(190, 78%, 56%);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.