蔚蓝色
CSS标准定义的柔和浅蓝，如晴空般开阔舒展
HEX
#98B4D4RGB
rgb(152, 180, 212)HSL
hsl(212, 41%, 71%)HSV
hsv(212, 28%, 83%)CMYK
cmyk(28%, 15%, 0%, 17%)HEXA
#98B4D4FFRGBA
rgba(152, 180, 212, 1)HSLA
hsla(212, 41%, 71%, 1)OKLCH
oklch(88.3%, 0.028, 249)LCH
lch(86.6%, 17.9, 238)🎨 配色方案
相似色2-3个相邻色相（≤60°）
复制
#97D1D3复制
#98B4D4复制
#9997D3三色系3个间隔120°的色相
复制
#98B4D4复制
#D397B3复制
#B3D397分裂互补色主色 + 互补色两侧的颜色
复制
#98B4D4复制
#D39997复制
#D1D397互补色2个间隔180°的色相
复制
#98B4D4复制
#D3B797矩形双互补色4个形成矩形的色相
复制
#98B4D4复制
#D397D1复制
#D3B797复制
#97D399单色系单一色相，变化饱和度和亮度
复制
#2F4D6F复制
#4F7FB5复制
#98B4D4复制
#DFE7F1复制
#FFFFFF♿ WCAG 对比度配色
深入了解 →Aa14px 正文
高对比文字
适合正文、标题等主要内容，确保所有用户都能清晰阅读
Aa14px 正文
标准文字
适合普通正文内容，满足 WCAG AA 标准
Aa14px 正文
大文字/UI组件
适合大号文字（≥18px 粗体或 ≥24px）、图标、UI 组件边界
Aa14px 正文
装饰/分割线
适合装饰性元素、分割线、非必要信息文字
明度变化 (Lightness)固定色相与饱和度，明度按比例缩放 30%→100%
饱和度变化 (Saturation)固定色相与明度，饱和度按比例缩放 40%→100%
明度 + 饱和度混合变化明度与饱和度同时按比例缩放 30%→100%
色相微调 (Hue Shift)固定饱和度与明度，步进微调色相 ±15°
💡 适用场景
网页主背景
用作网站或应用的背景色，能营造开阔、不压抑的浏览环境，尤其适合内容密集型页面。
家居墙面
涂刷于卧室或客厅墙面，为空间注入宁静气息，在视觉上延展空间，创造放松角落。
商务便装
男士衬衫或女士丝巾采用此色，既具专业感又不失柔和，打破正装刻板印象。
健康应用
冥想或医疗类APP的界面主色，能天然传达平静与疗愈，稳定用户的初始情绪。
📜 起源与历史
蔚蓝色的灵感源于澄澈的晴空与辽阔的水面，在西方艺术史中常被用来描绘远景天空，营造深远的空间感。19世纪印象派画家大量使用类似色调表现光影的瞬间变化。
在现代数字世界中，蔚蓝色被CSS标准化为一种浅蓝色调，成为网页与界面设计中极具亲和力的背景色。它让用户联想起户外与自由，因而在社交与旅行类应用中格外受欢迎。
中国传统中亦有类似色调，常出现在明清瓷器与宫廷服饰中，象征宁静高远。但中国传统称谓中并无蔚蓝一词的固定用法，此色更多是现代东西方色彩交融的产物。
蔚蓝色在品牌设计中代表可信赖与开阔，常被金融机构和科技公司用作辅助色。它既有蓝色的理性，又因浅淡而消除了距离感，创造了柔和专业的视觉平衡。
🧠 色彩心理学
开阔感仿若无垠天空的延伸，让人心胸舒展，思绪也随之变得宽广和自由。
柔和不具攻击性的浅调蓝色，温柔地包裹视线，令人放松戒备，感到舒适。
信赖与天空和海洋的恒常性相连，潜移默化地传递出稳定和可靠的感觉。
清新如雨后初晴的空气，洗去了沉重感，带来干净清爽的心理体验。
平复能有效降低心理上的躁动与紧张，帮助恢复平和与冷静的状态。
内省宁静的色调引导思绪向内探索，促发冥想与自我反思的时刻。