Как реализовать такую лампочку на css ?

*{ 
  box-sizing:border-box; 
} 
input{ 
  vertical-align:middle; 
} 
.light{ 
  display:inline-block; 
  vertical-align:middle; 
  width:40px; 
  height:40px; 
  border-radius:20px; 
  background:radial-gradient(circle at 50% 40%,white 20%,yellow 50%); 
  box-shadow:0 0 10px 2px rgba(255,255,0,.7); 
} 
:checked+.light{ 
  box-shadow:none; 
  background:radial-gradient(circle at 50% 40%,white 20%,gray 50%); 
}

<input type="checkbox" /> 
<span class="light"></span>

Можно например как-то вот так:

.lamp.on
{
  display:block;
  width:50px;
  height:50px;
  border-radius:25px;
  background-image: radial-gradient(white 20%,yellow 80%);
  box-shadow: 0px 0px 29px 1px rgba(235,220,7,1);
}
.lamp.off
{
  display:block;
  width:50px;
  height:50px;
  border-radius:25px;
  background-image: radial-gradient(white 10%,grey 80%);
  box-shadow: 0px 0px 10px 5px rgba(184,183,178,1);
}

Тогда в HTML'е у вас должно быть что-то такое:

<div class='lamp on'></div>
<div class='lamp off'></div>

Стоит поиграться с цветами для большего сходства.