50 % = #800080
RGB（sRGB）
对红、绿、蓝通道取平均。这是经典的计算方式，大多数编辑器都在使用。在高饱和的对立色之间，中间点往往偏暗、发灰。
颜色混合器：混合两种颜色，查看结果
选择两种颜色，调整比例，立即获得 HEX、RGB 和 OKLCH 格式的混合色，附带中间色阶和可直接复制的 CSS 代码。
结果：50%50%
颜色
颜色 B 比例：
50%A 50% · B 50%
混合空间
步数：
10
平衡：
background: color-mix(in srgb, #2C71DE 50%, #85ADEC); /* = #598FE5 */
颜色转换
热门混合
红色和蓝色混合是什么颜色？载入一组经典搭配，并按你的喜好调整。
混合两种颜色有什么用
颜色混合器按你选择的比例组合两种颜色，并计算出准确的混合色。这不同于从单一基色探索配色——那是色轮的功能：在这里，你从两种已确定的颜色出发，寻找它们之间的中间点。
它特别适合在两种品牌色之间找到过渡色、为界面状态（悬停、背景、边框）构建中间色阶，或者无需手动计算百分比就生成混合色的 CSS：工具同时提供原生 color-mix() 和 linear-gradient() 渐变。
三步混合两种颜色
选择两种颜色
点击颜色 A 或颜色 B，通过色相、亮度、吸管或输入代码进行调整。交换按钮可以反转顺序。
调整比例
拖动滑块，或使用 25%、50% 和 75% 快捷按钮。0% 时得到纯颜色 A，100% 时得到颜色 B。
复制结果
一键复制 HEX 颜色，或 color-mix() 代码、渐变、Tailwind 类。下方还有同一颜色的 RGB、HSL、CMYK、LAB 等格式。
为什么蓝色和黄色在屏幕上混合不是绿色？
在学校我们学过蓝色加黄色等于绿色。用颜料确实如此：颜料吸收光线，混合后只反射两者都不吸收的光，也就是绿色。这是减色混合。
屏幕混合的不是颜料，而是光。把蓝色和黄色的 RGB 通道取平均，它们会相互抵消，结果是灰色。如果你想要颜料那样的效果，可以自己加入绿色作为中间色，或者在能更好保持亮度的感知模式（OKLab）下比较结果。
RGB 还是感知：选择哪种混合空间
同一对颜色，在不同的色彩空间中计算会得到不同的混合结果。工具让你在最常用的两种之间选择，也正是 CSS color-mix() 函数支持的两种。
50 % = #8C53A2
感知（OKLab）
在根据人眼感知设计的色彩空间中插值。步进更均匀，中间色调更明亮。推荐用于界面色阶和渐变。
混合颜色与生成配色的区别
混合两种颜色
在你选择的两种具体颜色之间直接插值。结果取决于起始颜色和比例：适合你已有两种固定颜色、需要它们中间点的情况。
生成配色
根据单一颜色在色轮上的位置用数学方法计算（类似色、互补色、三分色……）。用于构建完整的调色板，而不是两种给定颜色之间的中间色。
常见问题
按照你选择的比例对颜色的每个分量进行插值。在 RGB 模式下对红、绿、蓝通道取平均；在感知模式（OKLab）下对 OKLab 的亮度和两个色彩轴进行插值，过渡更加均匀。
用颜料是绿色。在屏幕上以 RGB 50% 混合，是中性灰（纯蓝和纯黄为 #808080），因为光是加色混合，通道相互抵消。如果你需要绿色，请把它作为中间色加入。
紫色。纯红和纯蓝以 RGB 50% 混合得到 #800080；在感知模式下，紫色更浅。蓝色的权重越大，结果越偏冷。
它是一个原生 CSS 函数，直接在浏览器中混合两种颜色，例如 color-mix(in srgb, #E53935 50%, #1E88E5)。所有现代浏览器都支持。工具会生成该代码以及等效的 HEX 颜色，方便你需要固定值时使用。
可以。渐变标签页会生成连接颜色 A、混合色和颜色 B 的 linear-gradient()。如果需要更多色标或径向、锥形渐变，请使用渐变生成器。
色轮根据色彩理论规则，从单一基色计算相关颜色。混合器组合你选择的两种具体颜色，计算它们之间的中间点，而不是完整的调色板。
步数决定 A 和 B 之间色阶的色调数量，从 3 到 12。平衡把这些色调推向其中一种颜色，适合想在颜色 A 或颜色 B 附近获得更多层次时使用。点击色阶中的任意色调即可复制。
可以。工具下方显示混合色的 RGB、HSL、HSB、CMYK、LAB、LCH 等格式，“导出颜色”按钮可以下载完整色阶，用于 Tailwind、Figma 或 CSS。