CSS Shapes

by avaly

HTML

<div class="shape arrow-right-1"></div>
<div class="shape arrow-right-2"></div>

CSS

.shape {
    width: 0;
    height: 0;
    margin: 0 0 10px;
}
.arrow-right-1 {
    border-top: solid 50px transparent;
    border-right: solid 100px red;
    border-bottom: solid 50px transparent;
}
.arrow-right-2 {
    border-top: solid 50px transparent;
    border-right: solid 100px red;
}