两种颜色混合计算器

功能说明

设计配色时经常需要「把主色和辅助色调一下」，或者由两种颜色推算出它们之间的过渡色。本工具按 RGB 通道做线性加权混合，比例可自由调节，50% 即为两种颜色的精确中间色。

使用步骤

1. 分别选择颜色 A 与颜色 B，可以直接用取色器，也可以记下 HEX 值后粘贴。

2. 拖动「混合比例」滑块，实时预览混合结果；滑到 50% 得到中间色。

3. 结果区同时给出 HEX、RGB、HSL 三种格式，方便直接写进 CSS。

4. 「相对亮度」为 WCAG 标准亮度值，可用来判断该颜色上应该配黑字还是白字（对比度越大越清晰）。

常见问题

Q：混合结果会变灰吗？
A：互补色（例如蓝与橙）以 50% 混合时，RGB 各通道值相互接近，结果会偏灰；这是 RGB 空间加色混合的正常现象。

Q：和颜料混合一样吗？
A：不一样。屏幕用的是加色混合（光），颜料是减色混合，蓝颜料加黄颜料得到绿色，而蓝光加黄光得到白色。本工具计算的是屏幕颜色。

Q：怎么做半透明的颜色叠加？
A：需要使用 alpha 通道合成公式，本工具处理的是不透明颜色。若只是要浅一点的同色，可让颜色 A 与白色按比例混合。

你可能还想问

颜色混合是加色还是减色？

本工具按加色（光）模型以 RGB 通道加权平均；屏幕上混合偏亮（红加绿得黄），若按颜料减色规则（CMY）结果会不同，做印刷配色请用 CMYK 逻辑。

混合比例怎么影响结果？

按比例线性插值：50% 对 50% 得中间色，20% 对 80% 更靠近后者；做渐变色带时取多个比例点采样，能生成过渡自然的色阶数组。

生成的颜色能直接用于设计吗？

可以，输出 HEX/RGB 直接复制；但要注意感知均匀性——RGB 线性插值在深色区偏快、亮色区偏慢，追求专业渐变可用 Lab 空间插值的工具或方法。

相关工具

相关内容