窗灰色

透过窗格的天光灰白，内外空间的温柔过渡

灰色系沉静数字标准色

HEX#9DA3A6

RGBrgb(157, 163, 166)

HSLhsl(200, 5%, 63%)

HSVhsv(200, 5%, 65%)

CMYKcmyk(5%, 2%, 0%, 35%)

HEXA#9DA3A6FF

RGBArgba(157, 163, 166, 1)

HSLAhsla(200, 5%, 63%, 1)

OKLCHoklch(85.9%, 0.004, 228)

LCHlch(83.7%, 10.2, 218)

🎨 配色方案

相似色2-3个相邻色相（≤60°）

三色系3个间隔120°的色相

分裂互补色主色 + 互补色两侧的颜色

互补色2个间隔180°的色相

矩形双互补色4个形成矩形的色相

单色系单一色相，变化饱和度和亮度

♿ WCAG 对比度配色

深入了解 →

Aa14px 正文

高对比文字

#FFFFFF对比度 2.6:1Fail

适合正文、标题等主要内容，确保所有用户都能清晰阅读

Aa14px 正文

标准文字

#FFFFFF对比度 2.6:1Fail

适合普通正文内容，满足 WCAG AA 标准

Aa14px 正文

大文字/UI组件

#FFFFFF对比度 2.6:1Fail

适合大号文字（≥18px 粗体或 ≥24px）、图标、UI 组件边界

Aa14px 正文

装饰/分割线

#E4E2E3对比度 2:1Fail

适合装饰性元素、分割线、非必要信息文字

📊 色阶变体 (Scales)

在线调色 → 渐变生成器 →

明度变化 (Lightness)固定色相与饱和度，明度按比例缩放 30%→100%

#2E3133

#3F4346

#52585B

#636A6E

#747C81

#899194

#9CA2A5

饱和度变化 (Saturation)固定色相与明度，饱和度按比例缩放 40%→100%

#9FA1A3

#9EA2A3

#9DA2A4

#9CA2A5

明度 + 饱和度混合变化明度与饱和度同时按比例缩放 30%→100%

#2F3131

#414344

#545859

#656A6C

#767C7F

#8A9093

#9CA2A5

色相微调 (Hue Shift)固定饱和度与明度，步进微调色相 ±15°

#9CA5A5

#9CA4A5

#9CA3A5

#9CA2A5

#9CA1A5

#9CA0A5

💡 适用场景

🪟

窗框配色

铝合金断桥铝窗的窗灰色喷涂，让窗框低调融入建筑立面

💻

系统界面

macOS窗口的浅灰背景色，还原透过窗户看世界的自然光感

📚

图书馆

阅览室墙面的窗灰色涂料配合侧窗采光，营造沉浸式阅读环境

🎨

画廊展墙

美术馆的窗灰色展墙在自然光与人工照明切换中保持中立的色彩呈现

📜 起源与历史

窗灰色的命名源自建筑中窗户为室内带来的自然光色。17世纪荷兰画家维米尔在《倒牛奶的女仆》中精确描绘了从左侧窗格洒入室内的灰白天光，这种柔和的光线色彩后来以窗灰色命名。

维多利亚时代的日光摄影棚依赖北向天窗采光。摄影师发现晴天窗光在白色墙壁上反射后呈现稳定的浅灰蓝色调，窗灰色由此成为19世纪人像摄影的标准布光参考色。

北欧现代主义建筑将窗灰色作为室内设计的基础色彩。阿尔瓦·阿尔托设计的帕伊米奥疗养院以大面积的灰白色墙壁反射窗外的自然光，让北欧漫长冬季的有限日光最大程度渗透进室内。

数字产品设计中，窗灰色被苹果公司用于macOS窗口界面的背景色。这种模拟自然窗光的浅灰色让用户在屏幕前感受到类似透过窗户看世界的舒适与通透。

🧠 色彩心理学

通透透过玻璃的自然光色带来空间的开阔感，打破封闭空间的压抑

过渡内与外的边界色彩，在私密与开放之间建立柔和的缓冲区

明朗阴天窗光的亮度恰到好处，不过分明亮刺眼也不阴沉压抑

安静图书馆阅览室窗边座位的天光色，伴随翻书声的宁静氛围

希望窗是连接外界的通道，窗灰色因此带有期盼与向往的情绪暗示

中立模拟自然光的界面底色不干扰内容呈现，是数字阅读的最佳背景

← 返回色彩探索