$c1:#dd4b39;
$c2:#337ab7;
$c3:#f39c12;
$c4:#008d4c;
$c5:#d2d6de;

.color-preview {

  border: 1px solid tranparent;
  &.c1 {
    background-color: $c1;
    border-color: darken($c1, 20);
  }
  &.c2 {
    background-color: $c2;
    border-color: darken($c2, 20);
  }
  &.c3 {
    background-color: $c3;
    border-color: darken($c3, 20);
  }
  &.c4 {
    background-color: $c4;
    border-color: darken($c4, 20);
  }
  &.c5 {
    background-color: $c5;
    border-color: darken($c5, 20);
  }
}