如何在LESS中使颜色在亮色的情况下变得更暗，或者在暗色的情况下变得更亮

Question

给定一个颜色作为输入，如何在LESS中将其转换为较暗的颜色（如果它是浅色）或较亮的颜色（如果它是深色）？

例如：

• 当颜色是 暗色 时，结果类似于 darken（@color-input，10％）
• 当颜色是 浅色 时，结果类似于 lighten（@color-input，10％）

是否有可以应用的条件测试或任何{{link1：color operation}}可以得到此结果？

- Gyum Fox

---

你是在问如何检查颜色输入是浅色还是深色吗？ - myfunkyside

@seven-phases-max 我认为这个答案确实可以在这里使用 - Gyum Fox

@GyumFox 不确定为什么您选择混入变量，因为它比 contrast 相同的操作要长 3 倍。 - seven-phases-max

@seven-phases-max 我还没有测试对比度那个，我发现它更难理解。考虑在这里发布一个答案以达到我想要的结果，并解释为什么/如何工作。谢谢。 - Gyum Fox

@seven-phases-max 我在这里测试了对比度（http://less2css.org/#%7B%22less%22%3A%22div%5Cn%7B%5Cncolor%3A%20darken(white%2C%2010%25)%3B%5Cncolor%3A%20lighten(black%2C%2010%25)%3B%5Cn%7D%5Cn%5Cndiv%5Cn%7B%5Cncolor%3A%20contrast(white%2C%20lighten(white%2C%2010%25)%2C%20darken(white%2C%2010%25))%3B%5Cncolor%3A%20contrast(black%2C%20lighten(black%2C%2010%25)%2C%20darken(black%2C%2010%25))%3B%20%20%5Cn%7D%22%7D），它可以胜任！考虑发布为答案 :) - Gyum Fox

我已经投票将此问题标记为重复 - 不需要再次发布相同的问题。 - seven-phases-max

Answer 1

我认为这个问题被正确地识别为重复的，但是为了正确回答它，这里是正确的答案（基于seven-phases-max's answer）：

contrast(@color-input, lighten(@color-input, 10%), darken(@color-input, 10%));

您可以在此处查看一个工作示例。

您可以在此处阅读更多关于对比功能的信息。

- Gyum Fox

Answer 2

我不确定这是否是最佳答案，但以下代码似乎能够解决问题：

mix(@color-input, contrast(@color-input), 90%);

- Gyum Fox

---

加1分是因为巧妙地使用了“mix”。虽然这种方式的结果并不严格等于“darken/lighten”。 - seven-phases-max