couleur.io → Harmonizing Color Palettes for Your Web Projects

couleur.io是一个帮助用户创建协调网页调色板的简单工具，专注于通过HSL颜色模型生成适配网页项目的和谐色彩方案。

核心功能与使用流程
1. 基础色彩参数选择
用户首先通过“Pick a Starter Hue”选择基础色相（数值范围0360，对应色环从红开始再回到红的循环），再通过“Refine Saturation”调整饱和度（0%100%）。这两个参数是生成调色板的核心依据。

2. 主调色板生成
工具基于选定的基础色相和饱和度，通过改变亮度值生成10个颜色样本。这些颜色因共享相同的色相与饱和度，天然具备协调性，能直接用于网页的主色体系。

3. 辅助 accent 颜色建议
工具会将基础色相按45度增量旋转，生成多组accent（辅助）颜色灵感。其中，与基础色相相差90、135或180度的颜色，通常能形成舒适对比；而相差45或315度的颜色，对比效果可能较弱，用户可根据需求选择。

4. 主题场景预览
提供“浅色主题预览”和“深色主题预览”功能，模拟调色板在实际网页场景（如首页、关于页、联系页的标题、正文、按钮等元素）中的呈现效果，帮助用户直观判断色彩在不同主题下的适配性。

5. CSS变量快速应用
支持生成并复制CSS变量代码，用户可将basehue（基础色相）、basesat（基础饱和度）、primarylightness（主亮度）等变量引入网页项目。只需调整这些变量值，就能整体改变调色板的所有颜色；同时可通过accenthue（辅助色相）、accentlightness（辅助亮度）灵活调整辅助色，简化网页色彩管理流程。

工具原理
基于CSS的HSL颜色值设计（HSL即色相Hue、饱和度Saturation、亮度Lightness），通过分离颜色的三个维度参数，确保生成的颜色因共享核心属性而和谐统一，符合网页设计中色彩协调的需求。

额外信息
网站底部提供“关于”“致谢”“联系”“隐私政策”“条款”等链接，方便用户了解工具背景与规则。
作者还运营另一个工具网站muted.io，专注于音乐理论学习工具的创作。