<div class="div">
  <button class="primary">OK</button>
  <button class="secondary">Cancel</button>
  <button class="accent">Delete</button>
  <span>
    <a class="link">OK</a>
    <a class="link">Cancel</a>
    <a class="link">Delete</a>
  </span>

</div>
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
.div {
  padding-top: 2em;
  text-align: center;
  background: #333;
  height: 100%;
}
.div span {
  display: block;
  margin-top: 2em;
}
.primary {
  background: steelblue;
}
.secondary {
  background: orange;
}
.accent {
  background: red;
}

button:hover {
  opacity: 0.8;
}
a {
  color: green;
}

a:hover, button:hover {
  filter: brightness(1.75);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.