Less CSS Contrast Experiment

gistfile1.css

// light text, dark background
.contrast-check (@color; @bgcolor) when (lightness(@color) >= 50%) and (lightness(@bgcolor) < 50%) {
  color: @color;
  background-color: @bgcolor
}
// light text, light background
.contrast-check (@color; @bgcolor;) when (lightness(@color) >= 50%) and (lightness(@bgcolor) >= 50%) {
  color: contrast(@color, @color, lighten(@color, 60%));
  background-color: @bgcolor
}
// dark text, light background
.contrast-check (@color; @bgcolor) when (lightness(@color) < 50%) and (lightness(@bgcolor) >= 50%) {
  color: @color;
  background-color: @bgcolor;
}
// dark text, dark background
.contrast-check (@color; @bgcolor) when (lightness(@color) < 50%) and (lightness(@bgcolor) < 50%) {
  color: @color;
  background-color: contrast(@bgcolor, @bgcolor, lighten(@bgcolor, 60%));
}
.contrast-check (@color:#fff; @bgcolor:#000) {
//  a-lightness: lightness(@color);
//  b-lightness: lightness(@bgcolor);
}

//color: contrast(@background-color, @dark, @light, @threshold);


.light-dark { .contrast-check(#d5d5d5; #333) }
.light-light { .contrast-check(#d5d5d5; #ccc) }
.dark-light { .contrast-check(#333; #eee) }
.dark-dark { .contrast-check(#333; #333) }
.random { .contrast-check(peachpuff; cornflowerblue)}
.l2 { .contrast-check(#fff; white)}

/*
output:

.light-dark {
  color: #d5d5d5;
  background-color: #333333;
}
.light-light {
  color: #d5d5d5;
  background-color: #cccccc;
}
.dark-light {
  color: #333333;
  background-color: #eeeeee;
}
.dark-dark {
  color: #333333;
  background-color: #cccccc;
}
.random {
  color: #ffdab9;
  background-color: #6495ed;
}
.l2 {
  color: #ffffff;
  background-color: #ffffff;
}

*/