图片生成 CSS 渐变
导入一张照片或插画:系统会提取其主色调,并自动组合成可直接复制的 CSS linear-gradient 渐变。100% 在您的浏览器中本地处理(WebAssembly),您的图片绝不会发送到服务器。
将图片拖放到此处,或点击浏览。最大 25 MB。
工作原理
把一张照片的色彩氛围用于区块背景、横幅或商品卡片,而无需复制图片本身,这正是本工具的作用。它会分析导入图片的像素,提取出占比最高的色调,再按顺序组合成线性渐变,您可以先调整角度,再复制最终的 CSS 属性。
渐变的颜色顺序与图片一致吗?
颜色按其在源图片中出现的频率从高到低排序,渐变也按此顺序依次衔接。如果视觉效果不理想,可以先复制代码,再在样式表中手动调整颜色顺序。
选择多少种颜色效果比较干净?
两到三种颜色通常能得到清晰而优雅的渐变,接近常见的区块背景。超过四种颜色后,效果可能更像彩虹而不是柔和的渐变,只适合需要刻意突出的效果。
隐私:颜色提取和 CSS 生成完全通过 WebAssembly 在您的浏览器中进行,您的图片不会上传到服务器。