V
V
Vadim Belkin2015-07-23 17:57:55
Sass
Vadim Belkin, 2015-07-23 17:57:55

How to make automatic color matching?

I make a mixin, in which I pass the background color and, depending on it, through the condition and standard functions for working with color, sets the color of the text. If the background is dark, the color is white, and vice versa. I myself work in stylus, but I think each preprocessor will have more or less the same solutions. I myself used the stylus functions lightness, saturation, light, dark, but the desired result does not come out, it seems like everything is correctly selected for most colors, but it sometimes gives out white text to a light gray background (although black is more suitable there), then dark - red background black text.
There are probably some conditions for preprocessors for such a color selection? Please tell me how to do it right.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
D
Denis Malinochkin, 2015-07-26
@DiAsCrafts

Less has a pretty handy option for finding a contrasting color using the contrast().
The simplest use case:

.contrast(@bg) {
  color: contrast(@bg);
}

Usage example .
Documentation .
About color manipulation in Less .

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question