色彩工作室
调色板、渐变、色轮——找到完美颜色的所有方式。
AI 配色生成器
描述一种感觉,获得匹配的配色——由完全在浏览器中运行的真实神经网络驱动。无服务器、无等待、数据不出设备。
AI · 神经网络AI 设计规范生成器
描述你的品牌,获得完整设计系统——配色、字体搭配、字号层级、间距、圆角和阴影——由神经网络匹配并组装成一个可直接复制的 CSS 块。
AI · 设计系统颜色转换器
在HEX、RGB、HSL、CMYK和OKLCH之间即时双向转换。
转换 · 全格式配色关系
从任意基色生成互补、三角、类似和分裂互补配色方案。点击任意色块即可复制十六进制色值。
色彩 · 理论AI 色彩命名
输入任意色值,找到最接近的色名——CSS 标准色、中国传统色、日本和色及其他 12 种文化色彩。感知色彩科学找到真正最接近的匹配,AI 模型推荐相关配色主题。
AI · 色彩科学色轮
交互式色轮,探索色相、饱和度和颜色关系。点击选择并锁定颜色。
交互 · 可视化渐变生成器
设计漂亮的线性和径向渐变,实时 Canvas 预览,一键复制 CSS 代码。
渐变 · CSS导出渐变色预设库
浏览并复制15个精美渐变色预设。
预设 · 一键复制图片取色
使用智能色彩量化从任何图片中提取美丽的调色板。
提取 · 智能调色板生成器
使用单色、互补、类似色和三角色模式创建和谐的配色方案。实时预览并支持CSS导出。
颜色 · 交互式色阶生成器
从任意颜色生成完整色阶——20 级深浅,支持 HEX 和 SCSS 导出。
色阶, 颜色深浅, 调色板效果与层次
阴影、玻璃、圆角——让UI有真实感的细节。
有机形状生成器
生成平滑有机形状,用于背景、头像和分区装饰。一键随机生成,微调曲率,复制 border-radius 或 SVG 代码。
CSS · 有机形状圆角生成器
可视化圆角编辑器,实时预览。支持每个角独立控制,复制CSS代码。
CSS · 可视化编辑阴影生成器
交互式阴影生成器,支持多层叠加、实时Canvas预览和CSS输出。
CSS · 多层阴影CSS 按钮生成器
几秒内设计漂亮的按钮——6 种样式、自定义颜色、圆角和内边距,一键复制 CSS。
按钮生成器, CSS按钮, 按钮设计CSS 滤镜生成器
用 CSS filter() 构建视觉效果——模糊、亮度、对比度、色相旋转、复古棕褐等。示例图实时预览,一键复制完整滤镜链。
CSS · 图片特效玻璃拟态生成器
创建带背景模糊、透明度和细腻边框的毛玻璃卡片。实时预览,一键复制 CSS。
UI · 毛玻璃渐变文字生成器
用渐变填充和动画让文字出彩——调整角度和颜色,一键复制 CSS。
渐变文字, 文字渐变, CSS文字效果文字阴影生成器
设计多层文字阴影,实时预览。调整偏移、模糊、颜色和不透明度,一键复制 CSS。
CSS · 排版实用工具箱
检查、转换与系统,让设计保持可访问与一致性。
AI CSS 代码片段
描述你想要的效果——发光按钮、加载动画、玻璃卡片——神经网络找到匹配的 CSS 片段。实时渲染预览,复制即用代码。
AI · 代码库色盲模拟器
模拟颜色在色盲用户眼中的效果。
无障碍 · 模拟对比度检查器
验证文本和背景颜色的WCAG AA/AAA合规性,即时获取无障碍评分。
无障碍 · AA/AAA贝塞尔缓动生成器
设计自定义 CSS 缓动曲线,实时预览动画效果。拖动控制点、选择预设,一键复制 cubic-bezier() 函数。
CSS · 动效PX 转 REM 转换器
即时双向转换 PX 与 REM,支持自定义根字号和完整对照表。可访问、可缩放的 CSS 必备工具。
CSS · 单位CSS 变换生成器
可视化生成 CSS 变换——旋转、缩放、位移、倾斜,实时交互预览,一键复制完整 transform 属性。
CSS · 动画UI配色系统
从单个种子颜色生成完整的设计令牌调色板。导出到Tailwind、CSS或SCSS。
设计令牌 · Tailwind布局与网格
网格与比例——每个界面的结构骨架。
字体工坊
字体搭配与比例——设计的声音。
14种语言
每个工具、每个标签、每个指南——完全翻译。
无障碍优先
每个调色板包含WCAG对比度评分。从一开始就包容性设计。
开发者友好导出
CSS、Tailwind、SCSS、JSON——复制你项目需要的格式。