示例输入
#3b82f6 classic使用这个示例输入预览结果，再根据实际任务进行调整。
Tailwind 色阶生成器
可用从基础颜色生成 11 级 Tailwind 风格色阶。 TypeKitty 会在浏览器本地完成处理，帮助你保护输入内容与文件隐私。
颜色colour
50
#f1f4f9100
#dee6f3200
#b7cbeb300
#86ace9400
#4d8bef500
#156af4600
#0f59d1700
#144aa4800
#193c76900
#1a3156950
#142033CSS 变量
--typekitty-50: #f1f4f9; --typekitty-100: #dee6f3; --typekitty-200: #b7cbeb; --typekitty-300: #86ace9; --typekitty-400: #4d8bef; --typekitty-500: #156af4; --typekitty-600: #0f59d1; --typekitty-700: #144aa4; --typekitty-800: #193c76; --typekitty-900: #1a3156; --typekitty-950: #142033;
如何使用 Tailwind 色阶生成器
将品牌色转换为实用的 UI 色阶。 复制或下载前请检查处理结果。
添加输入
01输入内容或选择需要处理的本地文件。
调整设置
02根据任务检查并调整可用选项。
检查并导出
03确认结果后复制内容或下载生成的文件。
实用示例
可以从真实输入开始，再根据你的任务进行调整。
示例输入
#ff6600 hue-shift使用这个示例输入预览结果，再根据实际任务进行调整。
示例输入
tailwind color generator使用这个示例输入预览结果，再根据实际任务进行调整。
这个浏览器工具如何工作
TypeKitty 会在当前浏览器标签页中处理你输入的数据，不会将数据发送到 TypeKitty 工具 API。
无需账户
颜色 工作流
下载前可预览
当前限制
结果取决于输入是否有效，以及浏览器所支持的功能。
相关工具
全部工具开始前需要了解
使用建议
请在导出前检查预览结果，并保留原始文件作为备份。
使用建议
请在导出前检查预览结果，并保留原始文件作为备份。
常见问题
继续处理
返回当前工作台，或打开相关的 TypeKitty 工具。