CSS 命名色参考

Lavender 颜色代码

CSS Lavender·#E6E6FA

蓝色系冷调浅色调中饱和oklch(93.1% 0.027 286)
HEX
#E6E6FA主色 Token
RGB
rgb(230, 230, 250)屏幕色值
HSL
hsl(240 67% 94%)色相与明度
CMYK
8, 8, 0, 2印刷参考
LAB
92, 4, -10感知坐标
OKLCH
oklch(93.1% 0.027 286)现代感知空间
打开转换器打开色值查询

CSS Lavender 是一个浅色、中等饱和的CSS 命名色，对应色值为 #E6E6FA。如果您搜索的是 Lavender hex code、E6E6FA 或 Lavender RGB，这个页面可以直接提供精确色值、格式转换、对比度检查、相近颜色和查询/转换工具入口。

最佳文字颜色深色文字
正文对比度13.94:1
最佳用途产品界面强调、链接、选中态与稳定结构层

色阶

100#FBFBFE
300#F4F4FD
500#EBEBFB
600#E6E6FA
800#A6A6B4

对比度检查

白色文字放在该颜色上

按钮、标签、填充型操作。

1.23:1需拉开明度差

深色文字放在该颜色上

大标题和局部模块。

13.94:1AAA 级对比

该颜色用在浅色表面上

浅底上的链接、边框和图标。

1.17:1需拉开明度差
最佳文字颜色深色文字对比度 13.94:1

专业参考

OKLCHoklch(93.1% 0.027 286)
相对亮度0.8032
来源类型CSS 命名色
颜色分类
蓝色系冷调浅色调中饱和
来源上下文
来源类型
CSS 命名色
系统
CSS
最接近颜色
Tailwind Violet 100Tailwind Indigo 100Material Deep Purple 50
颜色说明
  • CSS Lavender 在这里作为 #E6E6FA 的精确CSS 命名色保留。
  • 搜索 Lavender color code、E6E6FA 或 Lavender RGB 的用户，通常需要先确认数值，再判断对比度和实现语境。

可访问性矩阵

白色文字放在该颜色上

纯白文字放在当前颜色底上。

1.23:1需拉开明度差

深色文字放在该颜色上

深色正文或标题放在当前颜色底上。

13.94:1AAA

该颜色用在浅色表面上

当前颜色用于浅色界面的链接、描边或图标。

1.17:1需拉开明度差

该颜色用在深色表面上

当前颜色用于深色壳层里的描边、标签或图标。

13.94:1AAA
最佳文字颜色深色文字对比度 13.94:1 · AAA

适用场景

  • 适合链接、激活导航、选中态和产品强调位。
  • 高饱和蓝色放在小号白字下方前，需要先检查对比度。
  • 可搭配白色、冷调中性色，以及同色系更浅或更深的蓝色。

参考说明

最后更新
2026-09-03
来源色库
CSS 标准色
整理方式
已核验来源色值 + 站内说明
颜色说明

CSS Lavender 收录自公开发布的 CSS 标准色，保留为可检索的参考色值，可直接用于产品与界面参考工作。

色相家族

稳定、专业、适合企业与产品系统的蓝色。

来源体系
CSS 命名色

相关颜色

Alice Blue

CSS Alice Blue

#F0F8FF·CSS 标准色

Light Steel Blue

CSS Light Steel Blue

#B0C4DE·CSS 标准色

Light Blue

CSS Light Blue

#ADD8E6·CSS 标准色

Powder Blue

CSS Powder Blue

#B0E0E6·CSS 标准色

Sky Blue

CSS Sky Blue

#87CEEB·CSS 标准色

配色起点

极光海岸

打开调色板库

蓝莓高压

打开调色板库

石墨蓝图

打开调色板库

实现片段

CSS 变量
:root {
  --color-lavender: #E6E6FA;
  --color-lavender-rgb: 230 230 250;
}
工具类写法
class="bg-[#E6E6FA] text-white"
class="hover:bg-[#A6A6B4] ring-1 ring-[#E6E6FA]"
JSON Token
{
  "lavender": "#E6E6FA",
  "lavenderRgb": [230, 230, 250],
  "lavenderHsl": [240, 67, 94]
}

继续到工具

打开转换器打开色值查询查看配色