A CodePen by M Naufal. Switch Button Single element - Switch Button Inspired by http://dribbble.com/shots/693683-iOS-App-Icon-Switch?list=popular&offset=148

index.html

<a href="#" class="btn"></a>

script.js

//Inspired by http://dribbble.com/shots/693683-iOS-App-Icon-Switch?list=popular&offset=148

style.css

@import url(http://fonts.googleapis.com/css?family=Open+Sans);
html{
  height: 100%;
}
body{
  background: -webkit-radial-gradient(center, ellipse cover, #b29f93 0%,#705f54 100%);
}
.btn{
	background: -webkit-linear-gradient(top, #fff 0%,rgba(255,255,255,0.1) 3%),-webkit-linear-gradient(bottom, #e9e4e0 0%,rgba(255,255,255,0.1) 3%), -webkit-linear-gradient(top, #e5e0d8 0%,#f9f6f1 100%);
	width: 100px;
	height: 100px;
	display: block;
	border-radius: 10px;
	margin:0px auto;
	box-shadow: 0px -3px 0px #d2cdc4, 0px 0px 0px 4px #777069, 0px -2px 0px 4px #777069, 0px 0px 0px 10px #f9f6f2, 0px -2px 0px 10px #f9f6f2, 0px 0px 0px 11px #f0ebe7, 0px -2px 0px 11px #f0ebe7, 0px 0px 0px 20px #f9f6f2, 0px 4px 1px 20px #e4e1dc, 0px -4px 0px 20px #fdfcfb, 0px 4px 20px 20px #000;
	margin-top: 50px;
}
.btn:after{
	content: '';
	width: 25px;
	height: 8px;
	margin: 15px 37px;
	box-shadow: 0px 1px 3px rgba(0,0,0,0.4) inset, 0px 1px 0px #fff;
	border-radius: 15px;
	background: #f8d608;
	position: absolute;
}
.btn:active{
	background: -webkit-linear-gradient(bottom, #e9e4e0 0%,rgba(255,255,255,0.1) 3%), -webkit-linear-gradient(top, #e5e0d8 0%,#f9f6f1 100%);
	box-shadow: 0px -4px 0px #d2cdc4 inset, 0px -3px 0px #e5e0d8, 0px 0px 0px 4px #777069, 0px -2px 0px 4px #777069, 0px 0px 0px 10px #f9f6f2, 0px -2px 0px 10px #f9f6f2, 0px 0px 0px 11px #f0ebe7, 0px -2px 0px 11px #f0ebe7, 0px 0px 0px 20px #f9f6f2, 0px 4px 1px 20px #e4e1dc, 0px -4px 0px 20px #fdfcfb, 0px 4px 20px 20px #000;
}