黄色——含义、调色板、互补色和和谐
实用的颜色指南 黄色的：象征主义和心理学， 色轮 关系（互补关系、相似关系、三元关系）， 无障碍 颜色组合和可下载的调色板。之间转换 十六进制, RGB， 和 HSL、复制 CSS 变量并预览搭配在一起的颜色。
提示：按 进入 在任何字段内更新所有值。
黄色一目了然
黄色象征着阳光、温暖、好奇心和乐观。它非常适合作为强调色来突出显示号召性用语、价格标签和警报。对于长篇阅读，请选择柔和的色调以获得舒适感。
纯黄色与白色的对比度较低。为了使 UI 易于访问，请将黄色放在海军蓝、木炭色或深紫色上。在浅黄色背景上使用黑色或深灰色文本。
黄色调色板
自动生成 色调 （更白）， 色调 （更黑），以及 音调 （更多灰色）从当前的黄色。单击任意样本以复制十六进制。您还可以下载 PNG 调色板。
色调
色调
音调
色轮和谐
探索 补充 颜色对， 类似的 邻居，以及 三元的 从这个黄色开始。这些现成的组合可帮助您找到搭配得很好的颜色。
色轮上的相反颜色可以为 CTA 和徽章创建高对比度。
方向盘上的邻居感觉很和谐——非常适合背景和渐变。
三种均匀间隔的色调为仪表板和图表提供平衡的对比度。
应用和最佳实践
品牌推广
黄色为零售、食品、儿童产品和旅游品牌增添了友善和活力。与木炭色或深海军蓝搭配，可实现专业的平衡和可读的排版。
用户界面和辅助功能
使用黄色作为按钮和亮点的强调色。对于较长的内容，请选择浅色作为背景并搭配深色文本，以满足 WCAG 对比度。
营销与包装
黄色在货架和社交媒体上吸引眼球。互补的蓝色或紫色创造出引人注目的英雄部分和产品卡。
特征
- 立即的 十六进制 ↔ RGB ↔ HSL 转换和同步。
- 自动调色板：色调、色调、色调以及可下载的 PNG 调色板。
- 色轮和谐：互补、相似、三元建议。
- 快的 CSS 变量 导出设计系统。
如何使用
- 输入十六进制（例如
#FFD600) 或 RGB/HSL 值并按 进入。 - 单击任何样本以复制其十六进制。使用互补或三元组以获得强烈的对比。
- 下载调色板 PNG 或复制 CSS 变量并粘贴到您的项目中。
- 检查对比度提示，以保持浅黄色 UI 上的文本可读。
常问问题
黄色适合搭配什么颜色？
海军蓝、木炭色、深紫罗兰色和浓郁的森林绿色是完美搭配。对于明亮的口音，请使用互补的青蓝色或紫色。
黄色的相反颜色是什么？
在 RGB/HSL 轮上，相反的色调接近 蓝青色 （与黄色色调大约 180°）。
正文可以使用黄色吗？
通常在浅色背景上不会。突出显示或图标保持黄色；而是在浅黄色卡片上使用深色文字。