Skip to content

Instantly share code, notes, and snippets.

@cimmanon
Last active August 29, 2015 14:15
Show Gist options
  • Save cimmanon/2a9c4f3e1a9743a11d15 to your computer and use it in GitHub Desktop.
Save cimmanon/2a9c4f3e1a9743a11d15 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<ul>
<li>one</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
</ul>
// ----
// Sass (v3.4.11)
// Compass (v1.0.3)
// ----
$qty: 40;
$step: 360deg / $qty;
@for $i from 0 through $qty - 1 {
li:nth-child(#{$i + 1}) {
background: adjust-hue(#08C026, $step * $i);
}
}
li:nth-child(1) {
background: #08c026;
}
li:nth-child(2) {
background: #08c042;
}
li:nth-child(3) {
background: #08c05d;
}
li:nth-child(4) {
background: #08c079;
}
li:nth-child(5) {
background: #08c094;
}
li:nth-child(6) {
background: #08c0b0;
}
li:nth-child(7) {
background: #08b4c0;
}
li:nth-child(8) {
background: #0899c0;
}
li:nth-child(9) {
background: #087dc0;
}
li:nth-child(10) {
background: #0862c0;
}
li:nth-child(11) {
background: #0846c0;
}
li:nth-child(12) {
background: #082ac0;
}
li:nth-child(13) {
background: #080fc0;
}
li:nth-child(14) {
background: #1d08c0;
}
li:nth-child(15) {
background: #3808c0;
}
li:nth-child(16) {
background: #5408c0;
}
li:nth-child(17) {
background: #7008c0;
}
li:nth-child(18) {
background: #8b08c0;
}
li:nth-child(19) {
background: #a708c0;
}
li:nth-child(20) {
background: #c008be;
}
li:nth-child(21) {
background: #c008a2;
}
li:nth-child(22) {
background: #c00886;
}
li:nth-child(23) {
background: #c0086b;
}
li:nth-child(24) {
background: #c0084f;
}
li:nth-child(25) {
background: #c00834;
}
li:nth-child(26) {
background: #c00818;
}
li:nth-child(27) {
background: #c01408;
}
li:nth-child(28) {
background: #c02f08;
}
li:nth-child(29) {
background: #c04b08;
}
li:nth-child(30) {
background: #c06608;
}
li:nth-child(31) {
background: #c08208;
}
li:nth-child(32) {
background: #c09e08;
}
li:nth-child(33) {
background: #c0b908;
}
li:nth-child(34) {
background: #abc008;
}
li:nth-child(35) {
background: #90c008;
}
li:nth-child(36) {
background: #74c008;
}
li:nth-child(37) {
background: #58c008;
}
li:nth-child(38) {
background: #3dc008;
}
li:nth-child(39) {
background: #21c008;
}
li:nth-child(40) {
background: #08c00a;
}
<ul>
<li>one</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
<li>two</li>
</ul>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment