此工具会对两种 sRGB 颜色的红、绿、蓝通道进行加权平均。比例为 50% 时，两种颜色的贡献相同。将滑块移向任意一端，结果中就会保留更多对应的原色。输入的颜色始终留在设备上，输出值可以直接粘贴到设计稿或样式表中。
数字 RGB 混合与颜料调色并不相同。颜料会吸收光线，实际混合后可能更暗或饱和度更低。这里计算的是精确的屏幕颜色，适合网站、界面和其他数字设计。
在线颜色混合器
全程在浏览器中运行，无需上传，无需注册。
50% A / 50% B
混合颜色数字 sRGB 混合
#9a7b8650% A / 50% B
HEX
#9a7b86RGB
rgb(154, 123, 134)HSL
hsl(339, 13%, 54%)CSS
--mixed-color: #9a7b86;两种颜色混合后是什么颜色？
颜色混合器会按选定比例合成两种数字颜色，并立即显示结果。选择或粘贴两个 HEX 色值，拖动滑块调整比例，再将结果复制为 HEX、RGB、HSL 或 CSS 变量。所有计算都在浏览器本地完成。
使用方法
- 1选择两种颜色. 使用取色器，或在颜色 A 和颜色 B 输入框中粘贴 3 位或 6 位 HEX 色值。
- 2设置混合比例. 向 A 或 B 拖动滑块，预览和所有色值会立即更新。
- 3复制结果. 将混合后的颜色复制为 HEX、RGB、HSL，或可直接使用的 CSS 自定义属性。
适用人群
- UI 设计师可以在两个品牌色或界面状态色之间寻找平衡的中间色。
- 前端开发者可以根据现有设计令牌生成可复用的 CSS 色值。
- 插画师和创作者可以在制作配色方案前测试数字颜色组合。
- 学生可以观察比例变化时 RGB 通道数值如何改变。
常见问题
在线颜色混合器可以免费使用吗？
可以。无需账号、无需下载，也没有使用次数限制。选择两种颜色，调整比例，然后按需复制任意数量的结果。
输入的颜色会上传到其他地方吗？
不会。色值通过浏览器中的 JavaScript 本地混合，输入内容不会发送到服务器。尚未公开的品牌色或产品色也可以放心测试。
一次可以混合多少种颜色？
此工具一次混合两种颜色，便于精确控制两者的比例。如果要加入第三种颜色，请将第一次的混合结果复制到一个输入框，再与下一种颜色混合。
颜色混合公式如何计算结果？
工具先将两个 HEX 色值转换为红、绿、蓝通道数值，再把选定百分比分别应用到每个通道。各部分相加并四舍五入到整数后，结果会转换为 HEX、RGB 和 HSL。
它能显示两种颜料混合后的颜色吗？
不能。此工具混合的是屏幕上显示的数字 sRGB 颜色。颜料使用减法混色，结果还会受到材料、浓度和光线影响，因此实物可能更暗，也可能发生色相偏移。
可以混合简写 HEX 色值吗？
可以。既能输入 #f06 这样的 3 位色值，也能输入 #ff0066 这样的 6 位色值，开头的 # 可以省略。简写色值会自动展开为常规 6 位格式。