skin

dabblet.css

/*	skin	*/ body { margin: 3em;}
.noise {width: 200px;height: 200px;
	background-color: rgb(253, 250, 240);/*base layer*/
	background-image:
/*L2*/linear-gradient(to right,
	    transparent 0px, rgba(255,255,255,.1) 1px, transparent 1px,
        transparent 6px, rgba(255,255,255,.2) 6px, transparent 7px),
/*L1*/linear-gradient(to right,
	    transparent,     rgba(255,255,255,.3) 1px, transparent 1px);
	background-size:     7px 1px, 3px 1px;
	background-position: 0px 0px, 0px 0px;
	                  /* L2       L1   */
	background-repeat:repeat, repeat;
}
.test{width: 200px;height: 200px;position:absolute;
	background-color: transparent;/*base layer*/
	background-image:
/*L2*/linear-gradient(to bottom,
	    transparent 0px, rgba(255,255,255,.15) 1px, transparent 1px,
        transparent 6px, rgba(255,255,255,.05) 6px, transparent 7px),
/*L1*/linear-gradient(to bottom,
	    transparent,     red 62px, transparent 1px);
	background-size:     1px 7px, 1px 6px;
	background-position: 0px 1px, 0px 1px;
	                  /* L2       L1   */
	background-repeat:repeat;top:50px;
    }

dabblet.html

<div class="noise">
</div><div class="test"></div>

dabblet.js

// alert('Hello world!');

settings.json

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