#C6B6E2 颜色代码洞察

您自信设计所需的所有颜色转换、和谐配色和无障碍性检查。

RGB:rgb(198, 182, 226)
HSL:hsl(262, 43%, 80%)
HEX
#C6B6E2
RGB
198, 182, 226
HSL
262°, 43%, 80%
HSV
262°, 19%, 89%
CMYK
12%, 19%, 0%, 11%

颜色转换

在一个地方生成多种颜色模型的值。

#C6B6E2

≈ 钢蓝色

参考色卡

较低的 ΔE 意味着更接近的视觉匹配

色调与阴影

探索将 #C6B6E2 与白色或黑色混合时的表现。这些色板非常适合悬停状态、阴影和背景。

悬停以复制任何十六进制值,并在您的界面中重复使用。

阴影

0–100%
0%#C6B6E2
10%#AF99D6
20%#997CCB
30%#825FBF
40%#6C46AF
50%#5A3A92
60%#482F75
70%#362358
80%#24173A
90%#120C1D
100%#000000

色调

0–100%
0%#C6B6E2
10%#CCBDE5
20%#D2C5E8
30%#D7CCEB
40%#DDD3EE
50%#E3DBF0
60%#E8E2F3
70%#EEE9F6
80%#F4F0F9
90%#F9F8FC
100%#FFFFFF

常见用例

  • UI 组件状态(悬停、活动、禁用)
  • 使用阴影和高光创建深度
  • 构建一致的颜色系统

设计系统

设计系统提示

这些变体构成了内聚调色板的基础。导出它们以保持营销、产品和工程部门的一致性。

导出调色板

和谐配色

使用由 #C6B6E2 生成的和谐配色,即时构建平衡的调色板。

点击任意色板以打开其详细信息页面并继续探索。

如何使用

选择一种主导颜色,然后让辅助色调作为排版、表面和行动号召按钮的强调色。

重要性

平衡的和谐配色能够传达意图——平静、活力、高端——而不会使您的布局过于复杂。

互补色

对立色调,可产生冲击力和大胆的对比。

最适合

高影响力行动号召、徽标和主视觉区域

邻近色

相邻色调,适用于自然、流畅的渐变。

最适合

自然灵感、平静的仪表板

三元色

三个均匀间隔的色调,实现活泼的平衡。

最适合

活泼的品牌设计和编辑布局

四元色

两对互补色,提供丰富的多样性。

最适合

插图和营销实验

单色系

同一色相家族中较浅和较深的同系色。

最适合

极简主义界面和高级 UI 状态

无障碍性对比度

检查 #C6B6E2 与常见文本颜色的可读性,确保每位访问者都能获得清晰的体验。

使用 AA 作为正文的基准,AAA 用于高级无障碍性。

黑色文本 上的示例文本
文本颜色#000000
背景#C6B6E2
对比度11.19:1
WCAG 等级AAA
白色文本 上的示例文本
文本颜色#FFFFFF
背景#C6B6E2
对比度1.88:1
WCAG 等级Fail
推荐文本预览
文本颜色#000000
背景#C6B6E2
对比度11.19:1
WCAG 等级AAA

技术格式

解锁专业色彩空间,如 XYZ、LAB、CMYK 变体和可导出配置文件。

免费注册

实用格式

获取打印模拟、LED 映射和开发人员就绪的字节顺序。

免费注册

颜色分析

深入研究光谱数据、主导色报告和高级分析。

免费注册

色盲模拟器

预览 #C6B6E2 在常见色觉缺陷下的显示效果。

免费注册

创意方面

探索季节关联、情感暗示和自然界中的出现。

免费注册

设计指导

平衡

将 #C6B6E2 视为高光色。将其与中性色和一种辅助色搭配,以避免视觉超载。

对比度

使用真实内容测试组合。更高的对比度可以提高浏览速度、可读性和转化率。

和谐

使用较浅的色调用于表面,基础色用于主色,较深的阴影用于悬停或按下状态。

需要其他颜色?

返回颜色选择器,上传图片、生成调色板并探索新的颜色关系。

打开颜色选择器