scss

@mixin angle($direction,$color,$value,$start){
content:"";
position:absolute;
@if $direction=="bottom"{
border-top:solid $color $value;
border-right:solid transparent $value;
border-left:solid transparent $value;
bottom:0;
left:50%;
transform:translate(-50%,100%);
}
@if $direction=="top"{
border-bottom:solid $color $value;
border-right:solid transparent $value;
border-left:solid transparent $value;
top:0;
left:50%;
transform:translate(-50%,-100%);
}
@if $direction=="left"{
border-right:solid $color $value;
border-top:solid transparent $value;
border-bottom:solid transparent $value;
top:0;
left:0;
transform:translate(-100%,0);
}
@if $direction=="right"{
border-left:solid $color $value;
border-top:solid transparent $value;
border-bottom:solid transparent $value;
top:0;

@if $start=="end"
{
right:0
}
@else{
left:-0.5vw
}

//@if (!!$start){left:-0.5vw}
transform:translate(100%,0);
}
}

.anglebottomleftselect{
position: relative;
width:10vw;
height:1vw;
background:red;
}
.anglebottomleftselect:before{
@include angle("right",blue,0.5vw,"end");
}
.anglebottomleftselect:after{
@include angle("right",#fff,0.5vw,"start");
}

 

 

<div class="anglebottomleftselect">test</div>