Skip to content

Instantly share code, notes, and snippets.

@damonbauer
Created February 22, 2014 20:10
Show Gist options
  • Save damonbauer/9161524 to your computer and use it in GitHub Desktop.
Save damonbauer/9161524 to your computer and use it in GitHub Desktop.
Incrementing color SCSS mixin. Pass in a number count to loop and a color to increment. However you decide to increment (darker, lighter, opaque, etc) is up to you. Example shows incrementing an anchor in a list item receiving a darker background color.
@mixin bgColor($count, $color) {
$loop_color: $color;
@for $i from 0 through $count {
$loop_color: shade($loop_color, 8%);
li:nth-of-type(#{$i}) > a {
background-color: $loop_color;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment