Puedes hacerlo simplemente usando CSS y ahorrarte las imágenes.
La cuestión es usar dos pseudo-elemento. Uno para crear el triángulo y otro para hacer el círculo.
Algo así:
Código CSS:
Ver originala {
position: relative;
display: inline-block;
margin: 0 10px;
padding: 5px 5px 5px 10px;
background: #666;
color: #fff;
text-transform: uppercase;
text-decoration: none;
font-size: .8rem;
white-space: nowrap;
border-radius: 0 2px 2px 0;
}
a:before {
position: absolute;
top: 0;
left: -11px;
content: '';
border-top: 11px solid transparent;
border-right: 11px solid #666;
border-bottom: 11px solid transparent;
}
a:after {
position: absolute;
top: 7px;
left: 0;
width: 6px;
height: 6px;
background: #fff;
border-radius: 50%;
content: '';
}
Que queda así: