调色板生成器
基础颜色
RGB
#e91e63
配色模式
调色板预览
色阶变化
导出代码
描述
调色板生成器适合设计师、前端开发、运营出图和品牌视觉整理场景。你可以先选择一个基础颜色，再快速生成互补色、类似色、三角色、分裂互补、四角色或单色系方案，同时查看色阶变化、复制单个颜色值，并导出可直接落地的代码配置。
页面能力
- 支持从预设色、随机色、色盘选择器或手动输入 `HEX` 颜色开始生成调色板。
- 支持互补色、类似色、三角色、分裂互补、四角色与单色系多种配色模式。
- 支持导出 `CSS`、`SCSS`、`JSON` 和 `Tailwind` 配置，适合直接接入项目样式系统。
适合场景
- 为品牌主色快速扩展出组件色板、交互色、浅深层级和主题配色。
- 在网页、后台、海报或活动页设计前先验证配色是否协调，减少反复试色成本。
- 把颜色方案导出给前端、设计规范或配置文件，统一多人协作时的颜色口径。
颜色转换能力
- 当前页面可将基础色在 `RGB`、`HSL`、`HSV`、`HWB`、`CMYK`、`LAB`、`LCH` 等格式之间切换查看。
- 适合在设计稿、CSS、打印沟通或色彩分析场景中快速换算，避免手动查表。
- 点击颜色即可复制结果，方便直接粘贴到样式文件、设计文档或组件库主题配置中。
使用建议
- 如果你要做整套 UI 主题，建议先确定基础品牌色，再结合单色系色阶补齐 hover、border、background 等层级。
- 自动生成的和谐配色更适合做“起点方案”；正式上线前仍建议结合可读性、对比度和品牌规范做人工调整。
- 当前工具更适合快速配色与代码导出，不替代专业设计软件中的精细色彩管理与视觉评审流程。
常见颜色表示法
- HEX： 前端最常见的十六进制表示法，适合直接写入 CSS 或设计规范。
- RGB / HSL： 更适合网页与交互场景，便于理解颜色通道、亮度和饱和度变化。
- CMYK： 更常用于印刷沟通；屏幕显示与印刷呈现之间可能存在色差。
- LAB / LCH： 更偏向专业色彩空间，适合做更细的颜色分析与感知调整。
调色板生成器 使用指南
调色板生成器是一款面向图片处理场景的在线工具，专注于基于基础色生成和谐配色方案并导出 CSS、SCSS、JSON、Tailw，支持在浏览器中快速完成核心操作。你可以直接粘贴内容或上传数据，按需选择参数，一键生成结果并复制或下载。工具适合开发调试、内容整理与学习验证等场景，尤其适合需要快速对比、统一格式或批量处理的任务。图片处理优先在浏览器本地完成，减少上传依赖，兼顾效率与隐私。如需处理敏感信息，建议在本地完成后及时清空输入，避免内容长时间停留。
使用步骤
- 上传图片或粘贴素材
- 调整参数或编辑样式
- 预览并微调效果
- 导出图片或复制结果
常见问题
- 图片会上传到服务器吗？
主要在浏览器本地处理，建议处理后清空页面数据。
- 导出清晰度不够？
可提高导出分辨率或使用原始尺寸。
- 支持多张处理吗？
建议分批处理，避免一次性加载过多图片。