#EDEFF8 颜色代码洞察

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

RGB:rgb(237, 239, 248)
HSL:hsl(229, 44%, 95%)
HEX
#EDEFF8
RGB
237, 239, 248
HSL
229°, 44%, 95%
HSV
229°, 4%, 97%
CMYK
4%, 4%, 0%, 3%

颜色转换

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

#EDEFF8

≈ 钢蓝色

参考色卡

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

色调与阴影

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

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

阴影

0–100%
0%#EDEFF8
10%#CAD0EA
20%#A7B1DD
30%#8492CF
40%#6173C2
50%#4457AE
60%#36468C
70%#293469
80%#1B2346
90%#0E1123
100%#000000

色调

0–100%
0%#EDEFF8
10%#EEF0F9
20%#F0F2F9
30%#F2F4FA
40%#F4F5FB
50%#F6F7FB
60%#F8F8FC
70%#F9FAFD
80%#FBFCFE
90%#FDFDFE
100%#FFFFFF

常见用例

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

设计系统

设计系统提示

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

导出调色板

和谐配色

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

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

如何使用

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

重要性

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

互补色

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

最适合

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

邻近色

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

最适合

自然灵感、平静的仪表板

三元色

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

最适合

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

四元色

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

最适合

插图和营销实验

单色系

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

最适合

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

无障碍性对比度

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

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

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

技术格式

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

免费注册

实用格式

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

免费注册

颜色分析

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

免费注册

色盲模拟器

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

免费注册

创意方面

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

免费注册

设计指导

平衡

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

对比度

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

和谐

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

需要其他颜色?

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

打开颜色选择器