Last Updated: February 25, 2016
·
2.84K
· kenseals

Test color lightness with Sass conditionals

Ever want to test the lightness of a color with Sass? You can do that. An example use case would be a mixin for button defaults. Test the lightness of the background to determine what color the text should be.

// Test lightness of background
@if lightness($color) > lightness(#aaa)
  color: darken($color, 75%)
@ else
  color: $white

Note: A space was added between "@" and "else" as a workaround to Coderwall's attempt at auto linking what it deems to be an @mention.