SASS script for creating quick colour pallette

sass.sass

$hue: 173;
$first-color: hsl($hue, 100%, 50%);
$second-color: complement($first-color);

.first-color {
  background: $first-color;
}
.second-color {
  background: $second-color;
}

@function is-cool-color($color) {
	@return hue($color) < 300 and hue($color) > 120;
}

@function is-high-key-value($color) {
	@return hue($color) > 30 and hue($color) < 140;
}

//Establish a relationship (similar lighting conditions) between colors.

@function harmonious-mix($mix, $base) {
	@if (is-cool-color($mix)){
		@if is-high-key-value($base) {
			@return mix($mix, $base, 11%);
		}
		@else {
			@return mix($mix, $base, 16%);
		}
	}
	@else {
		@if is-high-key-value($base) {
			@return mix($mix, $base, 13%);
		}
		@else {
			@return mix($mix, $base, 23%);
		}
	}
}


$harmonious-mix-first:  harmonious-mix($second-color, $first-color);
$harmonious-mix-second: harmonious-mix($first-color, $second-color);


.harmonious-mix-first {
  background: $harmonious-mix-first;
}
.harmonious-mix-second {
  background: $harmonious-mix-second;
}

@function mix-neutral($color) {
	@if (is-highest-key-value($color)) {
		@if is-high-key-value(complement($color)) {
			@return mix(complement($color), $color, 19%);
		}
		@else {
			@return mix(complement($color), $color, 13%);
		}
	}
	@else if (is-high-key-value($color)) {
		@if is-high-key-value(complement($color)) {
			@return mix(complement($color), $color, 31%);
		}
		@else {
			@return mix(complement($color), $color, 23%);
		}
	}
	@else {
		@if is-highest-key-value(complement($color)) {
			@return mix(complement($color), $color, 31%);
		}
		@if is-high-key-value(complement($color)) {
			@return mix(complement($color), $color, 26%);
		}
		@else {
			@return mix(complement($color), $color, 23%);
		}
	}
}
$neutral-first-1:  mix-neutral($first-color);
$neutral-second-1: mix-neutral($second-color);

$neutral-first-2:  mix-neutral($neutral-first-1);
$neutral-second-2: mix-neutral($neutral-second-1);

$neutral-first-3:  mix-neutral($neutral-first-2);
$neutral-second-3: mix-neutral($neutral-second-2);

.neutral-first-1 {
  background: $neutral-first-1;
}
.neutral-second-1 {
  background: $neutral-second-1;
}
.neutral-first-2 {
  background: $neutral-first-2;
}
.neutral-second-2 {
  background: $neutral-second-2;
}
.neutral-first-3 {
  background: $neutral-first-3;
}
.neutral-second-3 {
  background: $neutral-second-3;
}