Returns a tint or shade of a color in increments - 8%, 20%, 50%, or 75%.

Monotone Palette

@function shade($color, $percent) {
  @return mix(black, $color, $percent);
}
 
@function tint($color, $percent) {
  @return mix(white, $color, $percent);
}
 
@function mono-palette($color, $mix: null) {
  @if $mix == tint1 {
    @return tint($color, 8%);
  } @else if $mix == tint2 {
    @return tint($color, 20%);
  } @else if $mix == tint3 {
    @return tint($color, 50%);
  } @else if $mix == tint4 {
    @return tint($color, 75%);
  } @else if $mix == shade1 {
    @return shade($color, 8%);
  } @else if $mix == shade2 {
    @return shade($color, 20%);
  } @else if $mix == shade3 {
    @return shade($color, 50%);
  } @else if $mix == shade4 {
    @return shade($color, 75%);
  } @else {
    @return $color;
  }
}