<div class="c1"></div>
<div class="c2"></div>
<div class="c3"></div>

body {
  background: #9999ff;
}

div {
  width: 90px;
  height: 20px;
  border-radius:20px;
}

.c1,
.c3 {
  background: -webkit-linear-gradient(left, transparent, white);
  background: -o-linear-gradient(left, transparent, white);
  background: -moz-linear-gradient(left, transparent, white);
  background: linear-gradient(left, transparent, white);
}


.c2 {
  background: -webkit-linear-gradient(right, transparent, white);
  background: -o-linear-gradient(right, transparent, white);
  background: -moz-linear-gradient(right, transparent, white);
  background: linear-gradient(right, transparent, white);
}