CSS 命名色参考

Beige 颜色代码

CSS Beige·#F5F5DC

黄色系暖调浅色调中饱和oklch(96.4% 0.033 107)
HEX
#F5F5DC主色 Token
RGB
rgb(245, 245, 220)屏幕色值
HSL
hsl(60 56% 91%)色相与明度
CMYK
0, 0, 10, 4印刷参考
LAB
96, -4, 12感知坐标
OKLCH
oklch(96.4% 0.033 107)现代感知空间
打开转换器打开色值查询

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

最佳文字颜色深色文字
正文对比度15.50:1
最佳用途注意力标记、重点高亮、暖色背景与提醒型状态

色阶

100#FDFDF9
300#FAFAEF
500#F7F7E2
600#F5F5DC
800#B0B09E

对比度检查

白色文字放在该颜色上

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

1.11:1需拉开明度差

深色文字放在该颜色上

大标题和局部模块。

15.50:1AAA 级对比

该颜色用在浅色表面上

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

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

专业参考

OKLCHoklch(96.4% 0.033 107)
相对亮度0.8988
来源类型CSS 命名色
颜色分类
黄色系暖调浅色调中饱和
来源上下文
来源类型
CSS 命名色
系统
CSS
最接近颜色
Material Amber 50CornsilkMaterial Lime 50
颜色说明
  • CSS Beige 在这里作为 #F5F5DC 的精确CSS 命名色保留。
  • 搜索 Beige color code、F5F5DC 或 Beige RGB 的用户，通常需要先确认数值，再判断对比度和实现语境。

可访问性矩阵

白色文字放在该颜色上

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

1.11:1需拉开明度差

深色文字放在该颜色上

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

15.50:1AAA

该颜色用在浅色表面上

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

1.05:1需拉开明度差

该颜色用在深色表面上

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

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

适用场景

  • 适合重点高亮、提醒型标签、暖色背景和注意力标记。
  • 大多数黄色界面文字都更适合使用深色字。
  • 可搭配炭黑、深橄榄、暖中性和克制的橙色强调。

参考说明

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

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

色相家族

传递活力、温度和注目性的亮黄与金黄。

来源体系
CSS 命名色

相关颜色

Khaki

CSS Khaki

#F0E68C·CSS 标准色

Goldenrod

CSS Goldenrod

#DAA520·CSS 标准色

Gold

CSS Gold

#FFD700·CSS 标准色

Yellow

CSS Yellow

#FFFF00·CSS 标准色

Cornsilk

CSS Cornsilk

#FFF8DC·CSS 标准色

配色起点

电荷冰柠

打开调色板库

琥珀剧场

打开调色板库

金箔相框

打开调色板库

实现片段

CSS 变量
:root {
  --color-beige: #F5F5DC;
  --color-beige-rgb: 245 245 220;
}
工具类写法
class="bg-[#F5F5DC] text-white"
class="hover:bg-[#B0B09E] ring-1 ring-[#F5F5DC]"
JSON Token
{
  "beige": "#F5F5DC",
  "beigeRgb": [245, 245, 220],
  "beigeHsl": [60, 56, 91]
}

继续到工具

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