Untitled

dabblet.css

.star {
	float: left;
	color: #aaa;
	border-style: solid;
	border-color: currentColor transparent;
	border-width: 8px 10px 0;
	margin-top: 6px;
	transition: all 0.15s ease-in-out;
}
.star::before,
.star::after {
	content: '';
	position: absolute;
	border-style: solid;
}
.star::before {
	border-width: 0 8px 20px;
	border-color: currentColor transparent;
	margin-top: -16px;
	margin-left: -8px;
}
.star::after {
	border-width: 0 10px 7px;
	border-color: #fff transparent;
	margin-top: -1px;
	margin-left: -10px;
}
.stars:hover .star {
	color: #faa;
}
.star:hover, .star:hover ~ .star {
	color: #aaa;
}

dabblet.html

<div class="stars">
  <div class="star"></div>
  <div class="star"></div>
  <div class="star"></div>
  <div class="star"></div>
  <div class="star"></div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

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