Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// ----

$white: #fff;
$medium_gray: #999;
$sea_green: #16a085;
$pomegranate: #c0392b;
$orange: #e04604;
$chartreuse: #6a8500;
$pink: #b72898;
$purple: #491f70;
$turquoise: #02b4ce;
$green_gray: #7f8c8d;

$palette: ("greengray": $green_gray, "pink": $pink, "orange": $orange, "green": $chartreuse, 
"purple": $purple, "turquoise": $turquoise, "pomegranate": $pomegranate, "seafoam": $sea_green);

@each $hexvar, $color in $palette {
    .color-palette-#{$hexvar} {
       a {
        color: $color;
        &:hover {
         text-decoration: none;
         color: $medium_gray;
        }
      }
       input[type="submit"],
       input[type="reset"],
       button {
          background-color: $color;
        
        &:hover {
          background-color: $medium_gray;
          color: $white;
        }
       }
    }
}

SassMeister-output.css

.color-palette-greengray a {
  color: #7f8c8d;
}
.color-palette-greengray a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-greengray input[type="submit"],
.color-palette-greengray input[type="reset"],
.color-palette-greengray button {
  background-color: #7f8c8d;
}
.color-palette-greengray input[type="submit"]:hover,
.color-palette-greengray input[type="reset"]:hover,
.color-palette-greengray button:hover {
  background-color: #999999;
  color: white;
}

.color-palette-pink a {
  color: #b72898;
}
.color-palette-pink a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-pink input[type="submit"],
.color-palette-pink input[type="reset"],
.color-palette-pink button {
  background-color: #b72898;
}
.color-palette-pink input[type="submit"]:hover,
.color-palette-pink input[type="reset"]:hover,
.color-palette-pink button:hover {
  background-color: #999999;
  color: white;
}

.color-palette-orange a {
  color: #e04604;
}
.color-palette-orange a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-orange input[type="submit"],
.color-palette-orange input[type="reset"],
.color-palette-orange button {
  background-color: #e04604;
}
.color-palette-orange input[type="submit"]:hover,
.color-palette-orange input[type="reset"]:hover,
.color-palette-orange button:hover {
  background-color: #999999;
  color: white;
}

.color-palette-green a {
  color: #6a8500;
}
.color-palette-green a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-green input[type="submit"],
.color-palette-green input[type="reset"],
.color-palette-green button {
  background-color: #6a8500;
}
.color-palette-green input[type="submit"]:hover,
.color-palette-green input[type="reset"]:hover,
.color-palette-green button:hover {
  background-color: #999999;
  color: white;
}

.color-palette-purple a {
  color: #491f70;
}
.color-palette-purple a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-purple input[type="submit"],
.color-palette-purple input[type="reset"],
.color-palette-purple button {
  background-color: #491f70;
}
.color-palette-purple input[type="submit"]:hover,
.color-palette-purple input[type="reset"]:hover,
.color-palette-purple button:hover {
  background-color: #999999;
  color: white;
}

.color-palette-turquoise a {
  color: #02b4ce;
}
.color-palette-turquoise a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-turquoise input[type="submit"],
.color-palette-turquoise input[type="reset"],
.color-palette-turquoise button {
  background-color: #02b4ce;
}
.color-palette-turquoise input[type="submit"]:hover,
.color-palette-turquoise input[type="reset"]:hover,
.color-palette-turquoise button:hover {
  background-color: #999999;
  color: white;
}

.color-palette-pomegranate a {
  color: #c0392b;
}
.color-palette-pomegranate a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-pomegranate input[type="submit"],
.color-palette-pomegranate input[type="reset"],
.color-palette-pomegranate button {
  background-color: #c0392b;
}
.color-palette-pomegranate input[type="submit"]:hover,
.color-palette-pomegranate input[type="reset"]:hover,
.color-palette-pomegranate button:hover {
  background-color: #999999;
  color: white;
}

.color-palette-seafoam a {
  color: #16a085;
}
.color-palette-seafoam a:hover {
  text-decoration: none;
  color: #999999;
}
.color-palette-seafoam input[type="submit"],
.color-palette-seafoam input[type="reset"],
.color-palette-seafoam button {
  background-color: #16a085;
}
.color-palette-seafoam input[type="submit"]:hover,
.color-palette-seafoam input[type="reset"]:hover,
.color-palette-seafoam button:hover {
  background-color: #999999;
  color: white;
}