color-schemer

_color-schemer.sass

// Define color schemes quickly

// Color schemes to choose from
//    complement
//    triad
//    tetrad
//    analogic
//    accented-analogic

$color-location: primary !default
$base-color: #f00 !default
$color-scheme: complement !default
$color-angle: 30 !default

@function color-schemer($color-location, $base-color, $color-scheme, $color-angle)
  // Primary, just return the base-color.
  @if $color-location == primary
    @return $base-color
  // Secondary colors
  @if $color-location == secondary
    @if $color-scheme == complement
      @return complement($base-color)
    @if $color-scheme == triad
      @return adjust-hue(complement($base-color), $color-angle)
    @if $color-scheme == tetrad
      @return complement($base-color)
    @if $color-scheme == analogic
      @return adjust-hue($base-color, $color-angle)
    @if $color-scheme == accented-analogic
      @return adjust-hue($base-color, $color-angle)
    @warn "Oops! You didn’t properly define $color-scheme (complement, triad...)"
  // Tertiary colors
  @if $color-location == tertiary
    @if $color-scheme == complement
      @return mix($base-color, complement($base-color))
    @if $color-scheme == triad
      @return adjust-hue(complement($base-color), -$color-angle)
    @if $color-scheme == tetrad
      @return adjust-hue($base-color, $color-angle)
    @if $color-scheme == analogic
      @return adjust-hue($base-color, -$color-angle)
    @if $color-scheme == accented-analogic
      @return adjust-hue($base-color, -$color-angle)
    @warn "Oops! You didn’t properly define $color-scheme (complement, triad...)"
  // Quadrary colors
  @if $color-location == quadrary
    @if $color-scheme == complement
      @return mix($base-color, complement($base-color))
    @if $color-scheme == triad
      @return mix($base-color, complement($base-color))
    @if $color-scheme == tetrad
      @return adjust-hue(complement($base-color), $color-angle)
    @if $color-scheme == analogic
      @return mix($base-color, complement($base-color))
    @if $color-scheme == accented-analogic
      @return complement($base-color)
    @warn "Oops! You didn’t properly define $color-scheme (complement, triad...)"
  @warn "Oops! You didn’t properly define $color-location (primary, secondary...)"

$color-schemer-loaded: true

colors.sass

@import color-schemer

$base-color: #39e
$color-scheme: accented-analogic
$color-angle: 40

$primary: color-schemer(primary)
$secondary: color-schemer(secondary)
$tertiary: color-schemer(tertiary)
$quadrary: color-schemer(quadrary)

.primary
  background-color: $primary
.secondary
  background-color: $secondary
.tertiary
  background-color: $tertiary
.quadrary
  background-color: $quadrary