down chevron

by Himanshu Joshi

HTML

<div class="caret-down"></div>

<div class="caret-right"></div>

CSS

div.caret-down::after {
  content: '';
  
  width: 9px;
  height: 9px;
  border-right: 2px solid #ccc;
  border-top: 2px solid #ccc;
  position: absolute;
  right: 40px;
  top: 50%;
  margin-top: -3px;
  transform: rotate(135deg);
}

.caret-right{
  position: relative;
}
div.caret-right::after {
  content: '';
  
  width: 9px;
  height: 9px;
  border-right: 2px solid #ccc;
  border-top: 2px solid #ccc;
  position: absolute;
  right: 40px;
  top: 50%;
  margin-top: -3px;
  transform: rotate(45deg);
}