颜色混合器
在线颜色混合器工具，支持两种颜色在 RGB 与 HSL 两种色彩空间下的实时融合预览。提供正片叠底、滤色、叠加等多种混合模式，展示混合后的十六进制与 RGB 具体色值。
颜色 A
预设色
⟷
颜色 B
预设色
混合结果
#2FA4AA
HEX
#2FA4AA
RGB
rgb(47,164,170)
HSL
hsl(183,57%,43%)
描述
颜色混合器适合在做按钮状态色、渐变过渡色、品牌中间色和插画配色时快速观察两种颜色混合后的结果。页面支持 `RGB`、`HSL`、`正片叠底`、`滤色` 四种模式，并通过比例滑杆实时展示混合色、渐变预览以及 `HEX / RGB / HSL` 三种输出格式。
模式差异
- `RGB` 混合更接近直接按通道平均，适合得到直观的中间色。
- `HSL` 混合更关注色相、饱和度和亮度变化，常用于找更平滑的过渡感。
- `正片叠底` 通常会更暗，适合模拟压暗、叠色或阴影感；`滤色` 则更亮，适合高光和提亮效果。
页面能力
- 支持双颜色选择器、手动输入十六进制和预设色快速切换。
- 支持通过滑杆调整混合比例，实时查看结果色块和渐变条。
- 结果区可直接点击复制 `HEX`、`RGB`、`HSL`，适合马上用于设计稿或代码。
使用建议
- 如果目标是得到“介于 A 和 B 之间”的常规过渡色，可先从 `RGB` 或 `HSL` 开始比较。
- 做 UI 主题时，建议同时观察混合结果与渐变条，能更快判断两端颜色是否协调。
- 混合算法只是辅助找色工具，真正落地时仍建议在真实背景、文字和组件场景中验证可读性。