网页配色方案

选择基础颜色和配色模式,一键生成协调的网页配色方案。支持互补色、类比色、三角色等多种经典配色模式,可预览实际UI效果并导出CSS变量。

UI效果预览

配色模式说明

互补色:色轮上相对的两个颜色,对比强烈,适合强调重点。
类比色:相邻的颜色组合,和谐统一,适合营造柔和氛围。
三角色:色轮上等距的三个颜色,丰富且平衡。
分裂互补色:基础色加互补色两侧的颜色,对比强烈但更柔和。
四角色:两组互补色组成,色彩丰富,适合复杂界面。
单色:同一色相的不同明度/饱和度,极简且专业。

导出配色方案