<a href="#" class="btn">The Button</a>
$btn-bkg: #f47721;
body {
  background: lighten($btn-bkg,35%);
  text-align: center;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
.btn {
  display: inline-block;
  padding: 18px;
  background: $btn-bkg;
  color: white;
  &:hover {
    background: darken($btn-bkg, 10%)
  }
}
View Compiled
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.