CSS 命名色参考

Slate Gray 颜色代码

CSS Slate Gray·#708090

灰黑中性色中性中间调低饱和oklch(59.3% 0.031 248)
HEX
#708090主色 Token
RGB
rgb(112, 128, 144)屏幕色值
HSL
hsl(210 13% 50%)色相与明度
CMYK
22, 11, 0, 44印刷参考
LAB
53, -2, -11感知坐标
OKLCH
oklch(59.3% 0.031 248)现代感知空间
打开转换器打开色值查询

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

最佳文字颜色深色文字
正文对比度4.23:1
最佳用途文字、表面、边框、阴影与基础界面结构

色阶

100#E5E8EB
300#BDC5CC
500#8A97A4
600#708090
800#515C68

对比度检查

白色文字放在该颜色上

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

4.05:1适合大字 / UI 组件

深色文字放在该颜色上

大标题和局部模块。

4.23:1适合大字 / UI 组件

该颜色用在浅色表面上

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

3.85:1适合大字 / UI 组件
最佳文字颜色深色文字对比度 4.23:1

专业参考

OKLCHoklch(59.3% 0.031 248)
相对亮度0.2090
来源类型CSS 命名色
颜色分类
灰黑中性色中性中间调低饱和
来源上下文
来源类型
CSS 命名色
系统
CSS
别名
Slate Grey
最接近颜色
Light Slate GrayLight Slate GreyMaterial Blue Grey 500
颜色说明
  • CSS Slate Gray 在这里作为 #708090 的精确CSS 命名色保留。
  • 搜索 Slate Gray color code、708090 或 Slate Gray RGB 的用户，通常需要先确认数值，再判断对比度和实现语境。

可访问性矩阵

白色文字放在该颜色上

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

4.05:1适合大字 / UI 组件

深色文字放在该颜色上

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

4.23:1适合大字 / UI 组件

该颜色用在浅色表面上

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

3.85:1适合大字 / UI 组件

该颜色用在深色表面上

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

4.23:1适合大字 / UI 组件
最佳文字颜色深色文字对比度 4.23:1 · 适合大字 / UI 组件

适用场景

  • 适合文字、表面、分割线、边框、层级和布局结构。
  • 应按对比度角色选择精确中性色，不要把所有灰色当作可互换。
  • 可搭配一个明确强调色，以及更浅或更深的中性色阶。

参考说明

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

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

色相家族

作为文字、背景和组件基础层的中性色。

来源体系
CSS 命名色

相关颜色

Gray

CSS Gray

#808080·CSS 标准色

Grey

CSS Grey

#808080·CSS 标准色

Silver

CSS Silver

#C0C0C0·CSS 标准色

White

CSS White

#FFFFFF·CSS 标准色

Black

CSS Black

#000000·CSS 标准色

配色起点

雾都晨曦

打开调色板库

霜白构成

打开调色板库

铬银序列

打开调色板库

实现片段

CSS 变量
:root {
  --color-slate-gray: #708090;
  --color-slate-gray-rgb: 112 128 144;
}
工具类写法
class="bg-[#708090] text-white"
class="hover:bg-[#515C68] ring-1 ring-[#708090]"
JSON Token
{
  "slateGray": "#708090",
  "slateGrayRgb": [112, 128, 144],
  "slateGrayHsl": [210, 13, 50]
}

继续到工具

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