颜色渐变生成器
为任意颜色生成从亮到暗的渐变色。 可调整步数并导出为 Tailwind CSS 调色板。
选择基础颜色
亮色调（更浅的颜色）
通过将白色混合到基础颜色中创建的更浅变体
暗色调（更深的颜色）
通过将黑色混合到基础颜色中创建的更深变体
分享此工具
📖
使用方法
Step 1
选择颜色
通过选择器或 HEX 代码指定颜色
→
Step 2
生成渐变
自动生成从亮到暗的渐变色
→
Step 3
复制
复制所需色阶的颜色代码
✨
功能特点
步数控制
调整渐变色的步数
多种格式
支持 HEX、RGB、HSL 格式复制
调色板导出
支持导出 Tailwind CSS 格式的调色板
❓
FAQ
默认10个步数，但可自由调整。
🔗相关工具
🎨
设计工具颜色代码转换器
在 HEX、RGB 和 HSL 颜色代码之间转换。 使用取色器和实时预览直观选择颜色。
🎨
设计工具取色器
使用色轮和滑块直观选择颜色。 获取并复制 HEX、RGB 和 HSL 格式的颜色代码。
🎨
设计工具图片颜色提取器
自动检测图片中的主色调并生成色板。 还可以点击图片任意位置提取单个颜色。
🎯
设计工具图片平均色提取器
计算整张图片或选定区域的平均颜色。 适用于配色方案选择或缩略图背景色。
🌈
设计工具CSS 渐变生成器
通过拖拽控制可视化创建 CSS 渐变。 支持线性、径向和锥形渐变类型，带预设。
🔲
设计工具CSS 阴影生成器
通过滑块可视化创建 CSS box-shadow。 支持多重阴影和内阴影。