我有一个输入元素，允许用户设置输入元素的背景颜色。
当用户设置输入元素的背景色时，我希望输入元素中的文本是与原始颜色形成对比的颜色。
例如：用户输入“黑色”作为输入背景色；那么输入的文本颜色将为白色。但是，如果用户输入“白色”作为输入颜色，则文本颜色将为黑色。 （除了黑色或白色，还有更多的情况。）
我将如何实现？我知道您可以在背景顶部使用另一个元素并设置mix-blend-mode，但是我不想这样做，因为那样会删除输入点。
谢谢！
答案 0 :(得分：2)
您可以根据颜色的十六进制值来计算黑色或白色与用户指定的颜色是否具有更高的对比度。
此链接详细介绍了进行此计算的两种方法。 https://24ways.org/2010/calculating-color-contrast/