CSS 命名色参考

Alice Blue 颜色代码

CSS Alice Blue·#F0F8FF

蓝色系冷调浅色调高饱和oklch(97.5% 0.013 244)
HEX
#F0F8FF主色 Token
RGB
rgb(240, 248, 255)屏幕色值
HSL
hsl(208 100% 97%)色相与明度
CMYK
6, 3, 0, 0印刷参考
LAB
97, -1, -4感知坐标
OKLCH
oklch(97.5% 0.013 244)现代感知空间

Alice Blue 就是 CSS 命名色 `#F0F8FF`。如果您搜索的是 `alice blue hex code`、`#F0F8FF` 或 `AliceBlue`,这里就是对应的精确命名色条目。它几乎接近白色,但带一点冷蓝倾向,适合文档表面、引导面板和安静的界面背景。

最佳文字颜色深色文字
正文对比度15.99:1
最佳用途近白背景、文档表面与 CSS 命名色精确核验

色阶

100#FCFEFF
300#F8FCFF
500#F3F9FF
600#F0F8FF
800#ADB3B8

对比度检查

白色文字放在该颜色上

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

1.07:1需拉开明度差

深色文字放在该颜色上

大标题和局部模块。

15.99:1AAA 级对比

该颜色用在浅色表面上

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

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

专业参考

OKLCHoklch(97.5% 0.013 244)
相对亮度0.9288
来源类型CSS 命名色
颜色分类
蓝色系冷调浅色调高饱和
来源上下文
来源类型
CSS 命名色
系统
CSS
别名
#F0F8FFF0F8FFAliceBlue
最接近颜色
Tailwind Sky 50Tailwind Blue 50Ant Design Geekblue 1
颜色说明
  • Alice Blue 对应的精确 CSS 命名色值就是 `#F0F8FF`。
  • 它比纯白更冷、略偏蓝,但仍然比大多数浅蓝界面色更接近白色。
  • 很多用户会在先搜 HEX 时,把它与 Light Cyan 或其他近白蓝色一起比较。

可访问性矩阵

白色文字放在该颜色上

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

1.07:1需拉开明度差

深色文字放在该颜色上

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

15.99:1AAA

该颜色用在浅色表面上

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

1.02:1需拉开明度差

该颜色用在深色表面上

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

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

适用场景

  • 适合文档表面、引导背景和其他接近白色的布局区域。
  • 应优先把它理解为 CSS 命名背景色,而不是强强调色或操作色。
  • 可搭配石板灰文字、Light Steel Blue 和更深的蓝色锚点建立层级。

参考说明

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

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

色相家族

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

来源体系
CSS 命名色

相关颜色

配色起点

实现片段

CSS 变量
:root {
  --color-alice-blue: #F0F8FF;
  --color-alice-blue-rgb: 240 248 255;
}
工具类写法
class="bg-[#F0F8FF] text-white"
class="hover:bg-[#ADB3B8] ring-1 ring-[#F0F8FF]"
JSON Token
{
  "aliceBlue": "#F0F8FF",
  "aliceBlueRgb": [240, 248, 255],
  "aliceBlueHsl": [208, 100, 97]
}