Flickery light

dabblet.css

/* Flickery light */

@keyframes light {
	0% {
		background: hsla(57, 60%, 80%, 1);
		box-shadow: 0 0 4px hsla(57, 60%, 99%, 1);
	}
	
	50% {
		background: hsla(57, 60%, 99%, 1);
		box-shadow: 0 0 30px hsla(57, 60%, 99%, 1),
		            0 0 20px hsla(57, 60%, 99%, 1);
	}
	
	100% {
		background: hsla(57, 60%, 80%, 1);
		box-shadow: 0 0 4px hsla(57, 60%, 99%, 1);
	}
}

@keyframes floor {
	0% {
		opacity: .3;
	}
	
	50% {
		opacity: 1;
	}
	
	100% {
		opacity: .3;
	}
}

html {
	background: #000;
}

#light {
	animation: light 3s infinite;
	background: #fff;
	height: 30px;
	width: 30px;
	border-radius: 50%;
	position: relative;
	left: 135px;
}

#floor {
	animation: floor 3s infinite;
	background: radial-gradient(hsla(57, 60%, 90%, .7) 10%, #000 70%);
	height: 100px;
	width: 300px;
	border-radius: 50%;
	position: relative;
	top: 100px;
}

dabblet.html

<div id="light"></div>
<div id="floor"></div>

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}