命名颜色 · #C5E6F7

Icy Landscape

Icy Landscape 即 #C5E6F7：rgb(197 230 247)、hsl(200 76% 87%)、oklch(0.906 0.042 230.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Blue mean? → · Icy Landscape color name →

#C5E6F7

oklch(0.906 0.042 230.2)

颜色转换

HEX: #c5e6f7
RGB: rgb(197 230 247)
HSL: hsl(200 76% 87%)
HWB: hwb(200 77% 3%)
OKLCH: oklch(0.906 0.042 230.2)
OKLab: oklab(0.906 -0.027 -0.032)
CIE Lab: lab(89.29 -8.52 -12.09)
LCH: lch(89.29 14.79 234.8)
CMYK: cmyk(20% 7% 0% 3%)

浅色调 · 深色调 · 灰色调

浅色调

CBE9F8
D1EBF9
D7EEFA
DCF0FA
E2F3FB
E8F5FC
EEF8FD
F3FAFD
F9FDFE

深色调

ABC8D7
92ABB7
798E99
61737C
4B5960
354045
21282C
0E1315
020303

灰色调

BEDBEB
B7D1DE
B0C6D2
A9BCC6
A2B2BA
9BA8AE
949EA2
8E9497
878A8B

配色和谐

互补色 +180°

C5E6F7
Icy Landscape
F8D9C8
≈ Peach Sachet

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

四角配色 +90° +180° +270°

对比度与无障碍

白底

WCAG 1.30:1 · APCA Lc 15

Fail

黑底

WCAG 16.03:1 · APCA Lc 88

AAA

最佳文字颜色: #000000

WCAG 16.03:1 (AAA) · APCA Lc 88

Contrast pairs

代码片段

CSS

:root {
  --icy-landscape: #c5e6f7;
  --icy-landscape-rgb: 197 230 247;
  --icy-landscape-oklch: oklch(0.906 0.042 230.2);
}

.element {
  color: var(--icy-landscape);
  background-color: hsl(200 76% 87%);
  border-color: oklch(0.906 0.042 230.2);
}

Tailwind CSS v4

@theme {
  --color-icy-landscape: #c5e6f7;
  --color-icy-landscape-50: #eaf8ff;
  --color-icy-landscape-100: #dbebf4;
  --color-icy-landscape-200: #c3d8e3;
  --color-icy-landscape-300: #a3bcc9;
  --color-icy-landscape-400: #86a4b3;
  --color-icy-landscape-500: #6a8c9d;
  --color-icy-landscape-600: #5a7685;
  --color-icy-landscape-700: #485f6a;
  --color-icy-landscape-800: #33454e;
  --color-icy-landscape-900: #233036;
  --color-icy-landscape-950: #121c21;
}

SCSS

$icy-landscape: #c5e6f7;
$icy-landscape-rgb: 197, 230, 247;
$icy-landscape-light: mix(#fff, $icy-landscape, 20%);
$icy-landscape-dark: mix(#000, $icy-landscape, 20%);

.element {
  color: $icy-landscape;
  box-shadow: 0 0 0 2px rgba($icy-landscape, 0.35);
}

相近的命名颜色

Palettes with similar colors

在工具中打开

取色器配色组合对比度检测 Studio JSON API