颜色代码与配色

灰色色值与色阶

灰色为多数界面系统提供结构性的中性色。冷灰和暖灰可建立层级、分隔表面，并让有彩强调色承担更明确的语义。

灰色 #6B7280

颜色格式

同一基础色在常用网页格式中的表示。

下载 SVG 色卡

HEX #6B7280

RGB rgb(107, 114, 128)

HSL hsl(220, 9%, 46%)

OKLCH oklch(55.0% 0.023 264.0)

灰色为多数界面系统提供结构性的中性色。冷灰和暖灰可建立层级、分隔表面，并让有彩强调色承担更明确的语义。

色调

颜色	名称	Hex	RGB	HSL
	White Smoke	#F9FAFB	249, 250, 251	210, 20%, 98%
	Ghost White	#F3F4F6	243, 244, 246	220, 14%, 96%
	Gainsboro	#E5E7EB	229, 231, 235	220, 13%, 91%
	Light Gray	#D1D5DB	209, 213, 219	216, 12%, 84%
	Silver	#9CA3AF	156, 163, 175	218, 11%, 65%
	Gray	#6B7280	107, 114, 128	220, 9%, 46%
	Dim Gray	#4B5563	75, 85, 99	215, 14%, 34%
	Dark Gray	#374151	55, 65, 81	217, 19%, 27%
	Charcoal	#1F2937	31, 41, 55	215, 28%, 17%
	Almost Black	#111827	17, 24, 39	221, 39%, 11%
	Slate Light	#F8FAFC	248, 250, 252	210, 40%, 98%
	Slate Pale	#F1F5F9	241, 245, 249	210, 40%, 96%
	Slate	#E2E8F0	226, 232, 240	214, 32%, 91%
	Cool Gray	#CBD5E1	203, 213, 225	213, 27%, 84%
	Steel	#94A3B8	148, 163, 184	215, 20%, 65%
	Slate Gray	#64748B	100, 116, 139	215, 16%, 47%
	Storm	#475569	71, 85, 105	215, 19%, 35%
	Gunmetal	#334155	51, 65, 85	215, 25%, 27%
	Dark Slate	#1E293B	30, 41, 59	217, 33%, 17%
	Midnight	#0F172A	15, 23, 42	222, 47%, 11%

三角和谐色

在色轮上等距分布的三种颜色，适合建立有对比又平衡的方案。

文字对比度

以下比值基于 WCAG 相对亮度公式。

白色文字NaN:1

黑色文字NaN:1

在对比度工具中检查 →

灰色的使用场景

01

界面背景和边框

02

文字层级

03

专业的单色布局

相关颜色

黑色 #000000

白色 #FFFFFF

海军蓝 #000080

米色 #F5F5DC