color darker when hover

HTML

<a href="">test darkness</a>

SCSS

a{
  position: relative;
  display:inline-block;
  background: rgba(red, 0.75);
  padding: 20px;
  
  &:before
  {
    content: ' ';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }

  &:hover
  {
    &:before
    {
      background-color: rgba(#000, 0.5); 
    }
  }
}