命名颜色 · #24604F

Teal Drama

Teal Drama 即 #24604F：rgb(36 96 79)、hsl(163 45% 26%)、oklch(0.445 0.068 171.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Teal mean? → · Teal Drama color name →

#24604F

oklch(0.445 0.068 171.5)

颜色转换

HEX: #24604f
RGB: rgb(36 96 79)
HSL: hsl(163 45% 26%)
HWB: hwb(163 14% 62%)
OKLCH: oklch(0.445 0.068 171.5)
OKLab: oklab(0.445 -0.068 0.01)
CIE Lab: lab(36.46 -23.78 3.66)
LCH: lch(36.46 24.06 171.2)
CMYK: cmyk(63% 0% 18% 62%)

浅色调 · 深色调 · 灰色调

浅色调

3B6F5F
517E6F
668D80
7B9D91
91ADA3
A6BDB4
BCCDC7
D2DDD9
E8EEEC

深色调

1E5244
184538
12382E
0C2C23
072019
041510
020A07
000302
000000

灰色调

306354
3A6758
446A5D
4D6D62
567067
5F736C
677771
6F7A76
787D7B

配色和谐

互补色 +180°

24604F
Teal Drama
714358
≈ Deep Carmine

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 7.33:1 · APCA Lc 85

AAA

黑底

WCAG 2.86:1 · APCA Lc 17

Fail

最佳文字颜色: #FFFFFF

WCAG 7.33:1 (AAA) · APCA Lc 85

Contrast pairs

代码片段

CSS

:root {
  --teal-drama: #24604f;
  --teal-drama-rgb: 36 96 79;
  --teal-drama-oklch: oklch(0.445 0.068 171.5);
}

.element {
  color: var(--teal-drama);
  background-color: hsl(163 45% 26%);
  border-color: oklch(0.445 0.068 171.5);
}

Tailwind CSS v4

@theme {
  --color-teal-drama: #24604f;
  --color-teal-drama-50: #e2fcf3;
  --color-teal-drama-100: #d2f0e6;
  --color-teal-drama-200: #b7ded2;
  --color-teal-drama-300: #94c3b4;
  --color-teal-drama-400: #74ac99;
  --color-teal-drama-500: #539580;
  --color-teal-drama-600: #477e6d;
  --color-teal-drama-700: #396557;
  --color-teal-drama-800: #294a3e;
  --color-teal-drama-900: #1b332b;
  --color-teal-drama-950: #0b1f18;
}

SCSS

$teal-drama: #24604f;
$teal-drama-rgb: 36, 96, 79;
$teal-drama-light: mix(#fff, $teal-drama, 20%);
$teal-drama-dark: mix(#000, $teal-drama, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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