<div class="nav">
  <div class="prev blue"></div>
  <div class="next blue"></div>
</div>

<div class="nav">
  <div class="prev green"></div>
  <div class="next green"></div>
</div>

<div class="nav">
  <div class="prev yellow"></div>
  <div class="next yellow"></div>
</div>

<div class="nav">
  <div class="prev orange"></div>
  <div class="next orange"></div>
</div>

<div class="nav">
  <div class="prev red"></div>
  <div class="next red"></div>
</div>

<div class="nav">
  <div class="prev purple"></div>
  <div class="next purple"></div>
</div>

.next { 
    -webkit-transform: rotate(135deg);
    margin: 50px 20px;
    width: 50px;
    height: 50px; 
    float: left;
}
.prev { 
    -webkit-transform: rotate(315deg); 
    margin: 50px 20px;
    width: 50px;
    height: 50px;
    float: left;
}
.next:after {
    content: '';
    width: 50px;
    height: 50px;
    background: white;
    position: absolute;
    left: 3px;
    top: 3px;
}
.prev:after {
    content: '';
    width: 50px;
    height: 50px;
    background: white;
    position: absolute; 
    left: 3px;
    top: 3px;
}
/* Clearfix */
.nav:after {
  content: "";
  display: table;
  clear: both;
}
/* Colors */
.green  { background: rgb(121, 193, 67);  }
.yellow { background: rgb(255, 217, 102); }
.orange { background: rgb(246, 178, 107); }
.blue   { background: rgb(109, 158, 235); }
.red    { background: rgb(224, 102, 102); }
.purple { background: rgb(194, 123, 160); }