如何生成给定颜色的相反颜色？

创建给定颜色的相反颜色

在这个问题中，目标是生成与给定颜色相反的颜色颜色。相反的颜色是指暗/亮的方面。例如，如果给定的颜色是黑色，则相反的颜色将为白色。

要创建此相反的颜色，需要一个名为 create_opp_color() 的函数。该函数应接受当前颜色作为参数并返回相反的颜色。以下是完成此任务的方法：

函数实现：

1. 将十六进制转换为 RGB： 假定给定颜色为十六进制格式。首先，将其转换为 RGB 分量。
2. 反转颜色分量：反转 R、G 和 B 分量的值（从 255 中减去）。
3. 将反转分量转换为十六进制：将每个反转分量转换回十六进制
4. 填充反转组件：每个十六进制组件都应该用零填充，以确保它是 2 位十六进制值。
5. 重建十六进制颜色字符串： 连接填充的 HEX 组件以形成相反的颜色string.

JavaScript 中的实现：

function create_opp_color(currentColor) {
    if (currentColor.indexOf('#') === 0) {
        currentColor = currentColor.slice(1);
    }
    if (currentColor.length === 3) {
        currentColor = currentColor.repeat(2);
    }
    const rgb = hexToRgb(currentColor);
    const invertedRgb = {
        r: 255 - rgb.r,
        g: 255 - rgb.g,
        b: 255 - rgb.b
    };
    const invertedHex = rgbToHex(invertedRgb);
    return '#' + invertedHex;
}

function rgbToHex(rgb) {
    let hex = '';
    for (const key in rgb) {
        if (rgb.hasOwnProperty(key)) {
            const component = rgb[key].toString(16);
            hex += component.length === 1 ? '0' + component : component;
        }
    }
    return hex;
}

function hexToRgb(hex) {
    let rgb = {};
    ['r', 'g', 'b'].forEach((key, i) => {
        rgb[key] = parseInt(hex.substr(i * 2, 2), 16);
    });
    return rgb;
}

高级技术：

如果您需要更多对比度，您可以根据原始颜色的亮度使用黑色或白色作为相反颜色。这是一个修改后的函数来执行此操作：

function create_opp_color(currentColor) {
    if (currentColor.indexOf('#') === 0) {
        currentColor = currentColor.slice(1);
    }
    if (currentColor.length === 3) {
        currentColor = currentColor.repeat(2);
    }
    const rgb = hexToRgb(currentColor);
    const brightness = Math.round((rgb.r * 0.299 + rgb.g * 0.587 + rgb.b * 0.114) / 255 * 100);

    return brightness > 50 ? '#000000' : '#FFFFFF';
}

现在，使用此函数，您可以轻松生成任何给定颜色的相反颜色，无论它是亮还是暗。

以上是如何生成给定颜色的相反颜色？的详细内容。更多信息请关注PHP中文网其他相关文章！