How to invert colors in LESS

问题:

Is there a particular color operation I'm not seeing where you can invert colors? I'm seeing lots of color methods but could not see a way to do this.

reference:

http://lesscss.org/

回答1:

There are multiple interpretation of inverting color.

• You want a color with the opposite hue:

  spin(@color, 180)

• You want a color that the sum with current one is white:

  #fff - @color

回答2:

I don't think there is a specific function to invert colors, but what you could do is set your colors as variables. e.g.:

@color1: #666;
@color2: #fff;

body {
background-color: @color1;
color: @color2;
}

h1 {
color: @color2;
}

Then, simply make an alternate stylesheet with the inverted colors set to the variables used in the primary stylesheet. As long as you use the variables throughout the css, those color will be inverted.