SOURCE

<div></div>

div{
  border:30px solid;
  width:30px;
  left:50px;
  position:absolute;
  border-color:transparent #24292e #24292e #24292e
}
div:before{
  content:'';
  left:-20px;
  position:absolute;
  border:8px solid;
  border-color:transparent transparent white white
}
div:after{
  content:'';
  left:30px;
  position:absolute;
  border:8px solid;
  border-color: transparent white white  transparent
}
div:hover:before{
  border-color:transparent transparent red red
}
div:hover:after{
  border-color: transparent red red  transparent
}
div:before,div:after{
  transition:all 0.3s ease;
}