Tailwind调色板
生成Tailwind CSS颜色配置。 免费在线使用 Tailwind调色板，无需注册，在浏览器中快速安全处理。
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
primary: {
50: '#F2F2FD',
100: '#E4E5FB',
200: '#BFC0F8',
300: '#9395F6',
400: '#5B5EF5',
500: '#1418EB',
600: '#0C0FC6',
700: '#0508AD',
800: '#010389',
900: '#010265',
950: '#000133',
},
},
},
},
}Tailwind调色板 可帮助你直接在浏览器中处理颜色。
该工具适合需要快速可靠结果的设计师、开发者和创作者。
Supported formats
Tailwind
CSS
SCSS
JSON
How it works
1
Step 1
打开 Tailwind调色板
2
Step 2
输入或导入颜色
3
Step 3
复制、导出或复用结果
要避免的常见错误
- 忘记检查对比度可能影响可读性。
- 使用过多颜色会让调色板更难应用。
专业技巧
- 将主色保存为 CSS 变量。
- 发布前在浅色和深色模式下测试调色板。
Privacy guaranteed: everything is processed locally in your browser.
处理会尽可能在浏览器本地完成。无需账户。
用于颜色项目的Tailwind调色板
生成Tailwind CSS颜色配置。
无精度损失的Tailwind调色板
转换基于精确值（HEX、RGB、HSL、OKLCH）。无视觉近似——颜色完全忠于您的设计意图。
免费在线Tailwind调色板
无需注册，无需下载软件。Tailwind调色板100%免费，可在任何浏览器中使用。免费方案每天可使用10次。
快速安全的Tailwind调色板
处理直接在浏览器内完成，速度极快。数据不会发送到服务器，您的颜色与文件保留在本地设备上。
用于分享与协作的Tailwind调色板
将结果导出为 HEX、RGB、HSL、CSS、JSON，或一键复制。非常适合与团队共享颜色规范或记录设计系统。
探索所有颜色工具
只需几次点击即可提取、转换颜色，生成调色板、渐变和 WCAG 对比度。
Related tools
指南和教程
通过详细指南学习如何使用我们的工具。
Frequently asked questions
是的，该工具可免费在线使用。
为保护数据，处理会尽可能在浏览器中完成。