渐变色带取色器介绍
CSS 渐变本质上是两端颜色之间的连续插值。渐变色带取色器把这条插值带可视化：你定义起点色与终点色，色带上每一个位置都对应一个确定的比例色值，点击即可精确取出。
插值默认在 sRGB 空间线性混合，与 CSS linear-gradient 的默认行为一致，因此从色带上取到的颜色可以无缝用于渐变的分段控制（color stop），实现比两端更细腻的多段渐变。
这个工具的经典用法是从渐变里挖中间色：一个看着高级的渐变按钮，精髓往往在中间那几个过渡色。取出来单独使用或加入色板，整套界面的色彩就会显得同源且成体系。
使用步骤
- 11：分别设置渐变起点色与终点色（支持 HEX/RGB）
- 22：观察下方色带渲染效果
- 33：在色带上点击或拖动，取色点显示插值结果
- 44：复制取色点的 HEX 值，或按 10% 步进批量取色
适用场景
- 从漂亮渐变中提取中间色加入设计规范
- 为图表配色生成两色之间的过渡色阶
- 制作多段渐变时精确定位 color stop
- 给暗色亮色主题生成同源色板
实用小贴士
- 把取到的中间色设为渐变的 50% stop，能让过渡更平滑、更有厚度
- 同一渐变里取 3-5 个色就够用，取太多反而破坏层次
- 深浅两端的对比度务必单独复核，插值色可能亮度接近导致文字看不清
常见问题
取到的颜色和 CSS 渐变显示的有色差？
工具按 sRGB 线性插值计算，与浏览器默认渲染一致。若页面声明了 color-interpolation 或广色域，会出现轻微偏差。
支持三色渐变吗？
当前版本支持两段端点。需要三段渐变时可以叠加两次取色结果手工合成。
能导出整个色阶吗？
可以按 10% 步进逐个复制。配合色卡生成器可以快速整理成规范。