互补色配色方案

工作原理

在色相环上,互补色是位于基础色正对面的颜色(色相相差 180°)。这两种色相搭配会形成强烈的视觉对比,在设计中常被用来让行动按钮、徽标或关键元素在相反颜色的背景上脱颖而出。本工具会精确计算出互补色,然后为每种色相生成一个更深和一个更浅的版本,让您直接得到一套可用的迷你配色。

为什么要用互补色配色,而不是邻近色配色?

邻近色(类似色)配色营造出和谐而低调的氛围,而互补色配色则有意制造视觉张力,吸引目光。它非常适合用于行动号召按钮、通知徽章,或任何需要从界面其余部分中明显突出的元素。

如何使用生成的浅色和深色变体?

深色变体适合用于文字,或「悬停」/「激活」状态;浅色变体则适合用作区块背景、禁用状态或低调的徽章,同时仍与主色或其互补色保持在同一色系内。

所有色彩计算(HEX/HSL 转换、色相旋转)都在您的浏览器中通过 JavaScript 本地运行。