命名颜色 · #7CAACF

Calm Day

Calm Day 即 #7CAACF：rgb(124 170 207)、hsl(207 46% 65%)、oklch(0.719 0.073 243.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Blue mean? → · Calm Day color name →

#7CAACF

oklch(0.719 0.073 243.3)

颜色转换

HEX: #7caacf
RGB: rgb(124 170 207)
HSL: hsl(207 46% 65%)
HWB: hwb(207 49% 19%)
OKLCH: oklch(0.719 0.073 243.3)
OKLab: oklab(0.719 -0.033 -0.065)
CIE Lab: lab(67.34 -8.79 -24.12)
LCH: lch(67.34 25.67 250)
CMYK: cmyk(40% 18% 0% 19%)

浅色调 · 深色调 · 灰色调

浅色调

89B2D4
96BBD9
A3C3DE
B0CCE3
BDD4E7
CADDEC
D7E5F1
E4EEF6
F2F6FA

深色调

6B93B4
5A7D99
4A687F
3B5367
2C3F4F
1E2D38
111B23
050B10
010102

灰色调

7DA6C7
7EA2BF
7E9DB7
7F99AF
7F95A7
80919F
808D97
808890
808488

配色和谐

互补色 +180°

7CAACF
Calm Day
C59B74
≈ Chimaera Brown

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 2.46:1 · APCA Lc 48

Fail

黑底

WCAG 8.50:1 · APCA Lc 54

AAA

最佳文字颜色: #000000

WCAG 8.50:1 (AAA) · APCA Lc 54

Contrast pairs

代码片段

CSS

:root {
  --calm-day: #7caacf;
  --calm-day-rgb: 124 170 207;
  --calm-day-oklch: oklch(0.719 0.073 243.3);
}

.element {
  color: var(--calm-day);
  background-color: hsl(207 46% 65%);
  border-color: oklch(0.719 0.073 243.3);
}

Tailwind CSS v4

@theme {
  --color-calm-day: #7caacf;
  --color-calm-day-50: #e5f8ff;
  --color-calm-day-100: #d4ebff;
  --color-calm-day-200: #bbd8f2;
  --color-calm-day-300: #99bcdb;
  --color-calm-day-400: #79a4c7;
  --color-calm-day-500: #5a8cb3;
  --color-calm-day-600: #4d7697;
  --color-calm-day-700: #3d5f79;
  --color-calm-day-800: #2a465a;
  --color-calm-day-900: #1c303f;
  --color-calm-day-950: #0c1c28;
}

SCSS

$calm-day: #7caacf;
$calm-day-rgb: 124, 170, 207;
$calm-day-light: mix(#fff, $calm-day, 20%);
$calm-day-dark: mix(#000, $calm-day, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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