如何在LESS中使颜色变暗，如果变暗，或者变亮[重复]答案

【问题标题】：How to make a colour darker if light, or lighter if dark in LESS [duplicate]如何在LESS中使颜色变暗，如果变暗，或者变亮[重复]
【发布时间】：2017-12-27 03:26:05
【问题描述】：

给定一种颜色作为输入，如何在 LESS 中对其进行转换，使其浅色变暗，深色变浅？

例如：

当颜色为dark时，结果类似于darken(@color-input, 10%)
当颜色为浅色时，结果类似于lighten(@color-input, 10%)

是否有任何可以应用的条件测试或任何color operation 会给出这个结果？

【问题讨论】：

您是在问如何检查颜色输入是浅色还是深色？
@seven-phases-max 我认为this answer确实可以在这里使用
@GyumFox 不知道为什么选择 mixin 变体，因为它比 contrast 长 3 倍。
@seven-phases-max 我没有测试对比的，我发现它更难理解。考虑在此处发布答案以达到我所追求的结果并解释它为什么/如何工作。谢谢
@seven-phases-max I tested the contrast one here 它完成了这项工作！考虑发布作为答案:)

标签： css colors less

【解决方案1】：

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

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

你可以在这里看到working example。

您可以在此处阅读有关contrast function 的更多信息。

【讨论】：

【解决方案2】：

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

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

【讨论】：

加 1 以方便使用 mix。虽然这种方式结果并不严格等于darken/lighten。