图像双色调效果
双色调用两种颜色之间的渐变替换图像的色调范围 — 阴影变成暗色，高光变成亮色，中间色调插值。结果是你在 Spotify 封面、独立专辑艺术和编辑摄影中看到的标志性外观。这个构建器在你浏览器的 canvas 中运行双色调（无上传），所以适用于你机器能处理的任何图像大小。中点滑块移动颜色分割发生的位置；对比度使曲线更陡或更平。输出是可下载的 PNG，加上等效的 SVG `feColorMatrix` + `feComponentTransfer` 滤镜，所以你可以通过 CSS `filter: url(#duotone)` 应用相同效果而无需重新光栅化。
—
使用方法
- 拖入图像。选预设（Spotify 绿黑是经典）或两种自定义 hex 颜色。
- 滑动中点控制阴影结束和高光开始的位置。调整对比度获得更强或更柔的过渡。
- 下载 PNG，或复制 SVG 滤镜以通过 CSS 在站点中任何元素上应用相同效果。
常见问题
- 为什么中间看起来浑浊?
- 默认对比度 0 是两色之间的线性斜坡。提高对比度使过渡变陡 — 当你的图像有很多中间灰色变成浑浊混合色时有用。降低给出更柔和、更绘画式的渐变。中点滑块为曝光不均的照片移动分割发生位置。
- SVG 滤镜版本如何工作?
- 用 `feColorMatrix` 将图像转换为灰度（使用 BT.709 亮度系数），然后用 `feComponentTransfer` 的 `table` 函数将每个通道重新映射到阴影和高光 RGB 值之间的 2 点渐变。结果：与 canvas 版本相同的效果，但无需光栅化 — 并可通过 SVG 滤镜上的 CSS 过渡进行动画。
相关工具
图像暗角生成器
为任何照片添加柔和的径向暗角 ─ 强度、柔度、半径、椭圆/圆形/矩形形状、变暗或变亮、自由配色。100% 浏览器内处理，无需上传。
图片 0 0
移轴 / 微缩模型 效果
为任何照片营造微缩模型效果 — 清晰对焦带 + 上下模糊，可选饱和度增强，全部在浏览器内。
图片 0 0
图像模糊
在浏览器中对任意图像应用高斯、方框或运动模糊。半径 0-64 px 可调,提供等效 CSS filter 字符串可复制。
图片 0 0
图像海报化
把照片每通道缩减为 N 级，获得平面海报艺术风格；可选 Floyd-Steinberg 抖动与按通道独立级数控制。
图片 0 0
CSS 滤镜演练场
可视化组合 blur、brightness、contrast、hue、sepia、invert 等 9 项——复制 CSS 滤镜或 Tailwind 任意值。
颜色 0 0
图片取色器
拖入图片，点击任意位置即可获取该像素精确的 HEX / RGB / HSL——一边取色一边收集调色板。
图片 0 0
图像精灵图生成器
拖入多张图像烘焙成单个 PNG 精灵 —— 水平、垂直或网格 —— 加上可粘贴的 CSS background-position 规则。
图片 0 0