Create triangles with pure CSS. Useful for creating carets on pseudo elements.
bower install fonzie-triangle
You can turn any box into a triangle:
.triangle {
@include fz-triangle('north', $width: 20px, $height: 10px, $color: red);
}
But they're useful for creating carets on pseudo elements:
.tab {
&:after {
@include fz-triangle('south', $width: 16px, $height: 8px, $color: #555);
display: block;
content: '';
position: absolute;
bottom: 0;
left: 50%;
margin-left: -8px;
}
}