이름 색상 · #BCE6DE

Soothing Sea

Soothing Sea은(는) #BCE6DE: rgb(188 230 222), hsl(169 46% 82%), oklch(0.893 0.045 182.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Teal mean? → · Soothing Sea color name →

#BCE6DE

oklch(0.893 0.045 182.4)

색상 변환

HEX: #bce6de
RGB: rgb(188 230 222)
HSL: hsl(169 46% 82%)
HWB: hwb(169 74% 10%)
OKLCH: oklch(0.893 0.045 182.4)
OKLab: oklab(0.893 -0.045 -0.002)
CIE Lab: lab(88.13 -15.32 -0.85)
LCH: lch(88.13 15.35 183.2)
CMYK: cmyk(18% 0% 3% 10%)

틴트 · 셰이드 · 톤

틴트

C3E9E1
CAEBE5
D0EEE8
D7F0EB
DEF3EE
E5F5F2
EBF8F5
F2FAF8
F8FDFC

셰이드

A3C8C1
8BABA5
738E89
5D736F
475955
32403D
1F2826
0D1312
020302

톤

B6DBD4
B0D1CA
AAC6C1
A4BCB7
9EB2AE
98A8A4
929E9B
8C9492
868A89

색 조화

보색 +180°

BCE6DE
Soothing Sea
F7D0D9
≈ April Blush

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

사각 배색 +90° +180° +270°

대비 및 접근성

흰색 위

WCAG 1.35:1 · APCA Lc 17

Fail

검은색 위

WCAG 15.51:1 · APCA Lc 86

AAA

가장 좋은 글자색: #000000

WCAG 15.51:1 (AAA) · APCA Lc 86

Contrast pairs

코드 스니펫

CSS

:root {
  --soothing-sea: #bce6de;
  --soothing-sea-rgb: 188 230 222;
  --soothing-sea-oklch: oklch(0.893 0.045 182.4);
}

.element {
  color: var(--soothing-sea);
  background-color: hsl(169 46% 82%);
  border-color: oklch(0.893 0.045 182.4);
}

Tailwind CSS v4

@theme {
  --color-soothing-sea: #bce6de;
  --color-soothing-sea-50: #e8faf7;
  --color-soothing-sea-100: #d8ede9;
  --color-soothing-sea-200: #c0dbd6;
  --color-soothing-sea-300: #9fbfba;
  --color-soothing-sea-400: #81a8a0;
  --color-soothing-sea-500: #649089;
  --color-soothing-sea-600: #557a74;
  --color-soothing-sea-700: #44625c;
  --color-soothing-sea-800: #314843;
  --color-soothing-sea-900: #21322e;
  --color-soothing-sea-950: #101e1b;
}

SCSS

$soothing-sea: #bce6de;
$soothing-sea-rgb: 188, 230, 222;
$soothing-sea-light: mix(#fff, $soothing-sea, 20%);
$soothing-sea-dark: mix(#000, $soothing-sea, 20%);

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

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

피커 조합 대비 검사기 Studio JSON API