<div class="owl-carousel">
  <div class="owl-nav">
    <div class="owl-prev">
      <svg viewBox="-10 0 50 50">
        <path d="M50,0 10,25 50,50" fill="none" stroke="#000" stroke-width="10"/>
      </svg>
    </div>
    <div class="owl-next">
      <svg viewBox="10 0 50 50">
        <path d="M0,0 40,25 0,50" fill="none" stroke="#000" stroke-width="10"/>
      </svg>      
    </div>
  </div>
</div>

.owl-carousel{
  width: 100%;
  height: 150px;
  position: relative;
}

.owl-nav{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  top: 50%;
  transform: translate(0,-50%);
}

.owl-prev,.owl-next{
  width: 50px;
  height: 50px;
}

path{
  transition: 0.34s linear;
  fill: transparent;
}

path:hover{
  stroke: #999;
}