蓝绿色（Teal）是那种几乎每个人都能认出、却少有人能精确定义的颜色之一。它处于蓝色与绿色的交叉点，两种颜色各占一半，使其既非蓝色也非绿色——而正是这种模糊性赋予了它极高的多功能性。它被用于医院标识、奢侈时尚到数据可视化，却始终被那些默认选择更安全的蓝色或绿色的设计师所低估。
本指南为你提供完整的画面：Teal 的精确十六进制代码、它与绿松石色、青色和水色的比较，以及在各设计领域有效运用它的实用指南。
Teal 究竟是什么？
颜色名称 Teal 来源于普通绿翅鸭（Anas crecca）——一种小型淡水鸭，其独特的眼纹呈现出鲜艳的蓝绿虹彩。这个颜色名称在 19 世纪末进入英语使用，相比红、蓝、绿等颜色名称而言较为现代。
CSS 定义的 Teal 标准十六进制代码是 #008080。在 RGB 中，即 rgb(0, 128, 128)——绿色和蓝色各占中等强度，没有红色成分。绿色与蓝色的这种均等平衡是 Teal 的定义特征。它精确地位于色轮蓝绿区域的中点。
在 HSL 中，Teal 为 hsl(180, 100%, 25%)——色相精确在 180 度（蓝色与绿色的中点，也称青色），完全饱和，明度 25%。HSL 表示揭示了为何 Teal 给人纯粹、"洁净"的蓝绿感：它位于理论上的精确中点。
Teal 概览
属性
值
十六进制
#008080
RGB
rgb(0, 128, 128)
HSL
hsl(180, 100%, 25%)
CMYK
C:100% M:0% Y:0% K:50%
色相
180°（蓝绿色中点）
以鸟命名：绿翅鸭
普通绿翅鸭是一种遍布欧亚的小型涉水鸭。雄鸟拥有栗色头部，每只眼睛周围有独特的泪滴形斑纹——这个斑纹呈现出虹彩蓝绿色，也就是我们现在称为 Teal 的颜色。
虹彩性非常重要：自然界中的 Teal 会随光线角度略微变化，有时偏蓝，有时偏绿。这种光学现象正是"Teal"作为颜色概念足够灵活，能够涵盖一系列蓝绿色相的部分原因——即便 CSS 标准将其固定于特定的十六进制值。
这个名称遵循了英语颜色命名的经典模式：在标准化色彩系统出现之前，以鸟类（知更鸟蛋蓝、金丝雀黄、火烈鸟粉）和其他自然来源命名的颜色提供了精确的视觉参照。
Teal 与绿松石色：最常见的混淆
绿松石色（#40E0D0）是最常与 Teal 混淆的颜色，这种混淆情有可原——两者都是蓝绿色，都与水和自然相关联，都出现在相似的设计场景中。
关键区别在于明度和饱和度。Teal（#008080）是深沉、哑光的蓝绿色。绿松石色（#40E0D0）是明亮、鲜艳的浅蓝绿色。
在 RGB 中：
- Teal: rgb(0, 128, 128) ——中等亮度，深沉色调
- 绿松石色: rgb(64, 224, 208) ——高亮度，轻盈通透色调
绿松石色以同名宝石命名，通常呈亮丽的浅蓝绿色。绿松石色令人联想到加勒比海水、热带海滩和夏日活力。Teal 则相反，唤起深度、平静和精致感。
在设计中：绿松石色活泼轻盈；Teal 专业稳重。你可能会在儿童应用或海滩度假村网站中使用绿松石色；而在金融科技仪表板或医疗品牌中则会使用 Teal。
Teal 与绿松石色并排对比
属性
Teal
绿松石色
十六进制
#008080
#40E0D0
RGB
0, 128, 128
64, 224, 208
亮度
深沉
明亮
饱和度感受
哑光，严肃
鲜艳，活泼
联想
专业，平静
热带，充满活力
Teal 与青色：技术上的区别
青色（#00FFFF）是 Teal 完全饱和、完全明亮的"兄弟"。在 RGB 中，青色为 rgb(0, 255, 255)——绿色和蓝色通道均为最大强度。纯青色在屏幕上几乎让人目眩，在设计中很少直接使用。
Teal 本质上是更暗、更哑光的青色版本——相同的色相角度（180°），但明度为 25% 而非 50%。这使 Teal 成为青色的"可用"版本：保留了蓝绿色特征，却没有视觉攻击性。
在印刷中，青色是 CMYK 四色印刷中的颜色之一。由于色域限制，Teal 无法在 CMYK 中完美复制——Teal 深沉、饱和的蓝绿色需要精确的油墨混合，不同印刷机的效果会有所不同。
Teal 与水色（Aqua）
Aqua 在 CSS 中与青色定义完全相同——两者都指向 #00FFFF。在 HTML/CSS 规范中这两个名称可以互换。然而在日常用语中，"Aqua"倾向于描述蓝色多于绿色的较浅蓝绿色（偏向天空和水体意象），而"Teal"则保留给更深、更饱和的蓝绿色。
实用要点：如果设计简报中有人说"Aqua"，他们可能指的是更接近绿松石色或浅 Teal 的颜色，而非 CSS 技术定义。务必索取十六进制代码以确认。
蓝绿色家族一览
颜色
十六进制
气质
Teal
#008080
深沉，哑光，专业
绿松石色
#40E0D0
明亮，鲜艳，热带感
青色 / 水色
#00FFFF
最高亮度，仅限屏幕
海沫绿
#93E9BE
浅淡，柔和，有机感
深 Teal
#003D3D
近黑蓝绿，戏剧感
Teal 在网页与数字设计中的应用
Teal 在数字设计中表现出色，原因有几点。它足够独特，能使品牌区别于蓝色主导的竞争对手，同时又足够专业，适用于保守行业。
Teal 在 UI 设计中的适用场景
导航元素和链接：在蓝色显得过于平庸的场景中，Teal 是出色的链接和强调色。它保留了用户对蓝色家族颜色的"可点击"联想，同时感觉更具辨识度。
数据可视化：Teal 是数据可视化配色中最有用的颜色之一。它能清晰区分于红色和橙色（典型对比色），适用于定性和顺序两种刻度，且对大多数色盲类型保持可见。
医疗和健康：医疗行业已广泛采用 Teal 和蓝绿色。它们唤起洁净感、平静感和临床精准感，而没有纯蓝色的冰冷感。该颜色频繁出现于医院标识、健康应用和医疗设备品牌中。
金融科技和金融服务：Teal 已成为新兴金融科技品牌的热门选择，用以区别于传统银行的深蓝色。Robinhood（历史上）、Monzo 相邻品牌以及各种加密货币平台都使用 Teal 来传递"现代金融"的信号。
Teal 的对比度与无障碍性
基础 Teal #008080 在白色（#FFFFFF）背景上的对比度约为 4.5:1，通过了正常文字的 WCAG AA 标准，但略低于 AAA。对于需要 AAA 合规的小号文字，可将 Teal 略微加深——#006666 在白色上能实现更高比率。务必使用对比度检查器验证你的颜色组合。
深色背景上的 Teal 文字需要仔细处理。Teal 在黑色背景上可能显得荧光感强而显得突兀；Teal 在深灰色或藏青色背景上则更适合平衡的 UI 设计。
Teal 在时尚和纺织品中的应用
时尚界数十年来一直在使用 Teal，尽管名称各异。在 1950 至 1960 年代，Teal 在珠宝色系趋势中颇为突出。在 1990 年代，Teal 广泛出现在运动服装中（圣何塞鲨鱼 NHL 球队球衣、各种 NBA 扩张球队）。在当代时尚中，Teal 已在秋冬系列中稳定成为多功能珠宝色调。
时尚中的 Teal 配色
搭配
效果
Teal + 焦橙色
互补暖色，秋日感
Teal + 珊瑚色
高对比，充满活力
Teal + 金色
奢华珠宝色组合
Teal + 奶油色
洁净，精致对比
Teal + 藏青色
同色调蓝绿深度
Teal + 白色
清新，夏日对比
Teal 作为针织品和外套的颜色效果极佳。深沉的色相在针织质感中——尤其是羊毛和羊绒——赋予颜色一种较浅颜色无法企及的丰富感。作为配件颜色，Teal 包袋和鞋子可作为亮眼单品，同时又足够多功能，能与黑色、灰色和中性基本款搭配。
Teal 在室内设计中的应用
Teal 是过去十年最具影响力的室内设计颜色之一。它处于一个富有成效的中间地带：独特到足以成为真正的设计选择，又熟悉到不会让人感觉冒险。
关键室内应用场景
特色墙面：客厅、卧室和浴室的 Teal 特色墙持续受到欢迎。该颜色通过其绿色成分增添深度和温暖感，同时保持蓝色的平静特质。它在自然光和人工暖光下都有良好表现。
厨房橱柜：Teal 厨房橱柜已成为藏青色或鼠尾草绿的热门替代方案。它们比灰色或米色增添了更多个性，同时又足够精致，保持较高的转售价值。
家具软垫：Teal 天鹅绒沙发和扶手椅一直是室内设计趋势的稳定选择。天鹅绒的质感放大了颜色的深度，随光线角度在冷感和暖感之间转换——呼应了绿翅鸭羽毛的虹彩特质。
浴室瓷砖：几何图案的 Teal 和蓝绿色瓷砖定义了"摩洛哥浴室"美学，这一风格在室内设计摄影和装修节目中长期保持热度。
Teal 的深浅变体
CSS 定义的 #008080 只是一系列蓝绿色值中的一个点：
变体
十六进制
描述
浅 Teal
#20B2AA
CSS "浅海绿"
Teal（标准）
#008080
CSS 定义的 Teal
深 Teal
#005F5F
更深，更正式
极深 Teal
#003D3D
近黑色，戏剧感强
构建 Teal 配色方案
由于 Teal 精确位于色轮 180° 处——与红色恰好相对——其互补色是温暖的红橙色。这创造了适用于高能见度设计的强对比组合。
常见配色方案：
- 互补色：Teal + 珊瑚/赭石色（对立色，高对比）
- 类似色：Teal + 蓝色 + 绿色（和谐，常用于数据可视化）
- 分裂互补色：Teal + 橙红 + 红橙（丰富，复杂配色）
- 三角配色：Teal + 品红 + 黄色（鲜艳，三方平衡）
使用调色板生成器以 Teal 为起点构建这些配色方案，使用色彩转换器以 HEX、RGB、HSL、CMYK 或 OKLCH 格式导出值。
Teal 的色彩模型转换
格式
值
HEX
#008080
RGB
rgb(0, 128, 128)
HSL
hsl(180, 100%, 25%)
CMYK
C:100% M:0% Y:0% K:50%
OKLCH
oklch(0.51 0.10 192)
色彩转换器即时处理所有转换，支持以你工作流程所需的任何格式导出。
要点总结
Teal 的十六进制代码是 #008080——CSS 定义为中等亮度下蓝色和绿色各占一半，无红色成分
名称来源于普通绿翅鸭（Anas crecca），雄鸟眼纹呈独特的蓝绿虹彩
Teal 精确位于色相 180°——色轮上蓝色与绿色的精确中点
绿松石色（#40E0D0）更浅、更鲜艳；Teal 更深、更哑光——尽管经常混淆，两者是截然不同的颜色
青色（#00FFFF）和水色在 CSS 中技术上完全相同——Teal 本质上是青色更深、更可用的版本
在设计中，Teal 传递专业感、平静感和现代感——在医疗、金融科技和数据可视化领域尤为受欢迎
#008080 在白色背景上对比度约为 4.5:1，通过正常文字的 WCAG AA 标准
Teal 的互补色是暖红橙色——一种视觉对比强烈的组合
使用调色板生成器构建基于 Teal 的配色方案，使用色彩转换器进行格式转换