Untitled

dabblet.css

html {
	height: 100%;
	background: url(http://api.thumbr.it/whitenoise-200x200.png?background=4ea6ca00&noise=626262&density=45&opacity=10),
	            linear-gradient(15deg, hsla(10, 100%, 50%, 0.6), transparent 40%),
	            linear-gradient(-15deg, hsla(100, 80%, 30%, 0.6), transparent 40%),	
	            linear-gradient(135deg, hsl(48, 100%, 84%) 10%, hsl(100, 50%, 50%) 30%, hsl(204, 47%, 45%) 50%, hsl(244, 27%, 55%) 80%);
}

body {
	font-family: Segoe UI;
	text-align: center;
}

header {
	background: hsla(0,0%,0%,0.5);
	box-shadow: inset 0 0 5px hsla(0,0%,0%,0.7);
	border-radius: 50%;
	margin: 30px auto;
	padding: 1em 2em;
	width: 20em;
	height: 20em;
	font-family: "Segoe UI Light";
}

header > div {
	margin-top: 50%;
	transform: translateY(-50%);
	color: #fff;
}

h1 {
	font-size: 50px;
	margin: 0;
	font-weight: normal;
}

p {
	font-size: 31px;
	margin: 0;
}

dabblet.html

<header>
	<div>
		<h1><span class="jordan">Jordan</span> <span class="gray">Gray</span></h1>
		<p>Full stack developer</p>
	</div>
</header>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}