이름 색상 · #BBCFEF

Frost Fairy

Frost Fairy은(는) #BBCFEF: rgb(187 207 239), hsl(217 62% 84%), oklch(0.85 0.05 259.8). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Blue mean? → · Frost Fairy color name →

#BBCFEF

oklch(0.85 0.05 259.8)

색상 변환

HEX: #bbcfef
RGB: rgb(187 207 239)
HSL: hsl(217 62% 84%)
HWB: hwb(217 73% 6%)
OKLCH: oklch(0.85 0.05 259.8)
OKLab: oklab(0.85 -0.009 -0.049)
CIE Lab: lab(82.39 -1.91 -18.23)
LCH: lch(82.39 18.33 264)
CMYK: cmyk(22% 13% 0% 6%)

틴트 · 셰이드 · 톤

틴트

C2D4F1
C8D9F2
CFDDF4
D6E2F6
DDE7F7
E3ECF9
EAF1FA
F1F5FC
F8FAFE

셰이드

A2B4D0
8A99B1
737F94
5C6778
464F5C
323842
1F232A
0D1014
020203

톤

B5C7E3
AFBFD8
A9B7CD
A3AFC1
9DA7B6
979FAB
9197A0
8C8F95
86888B

색 조화

보색 +180°

BBCFEF
Frost Fairy
DFCBAA
≈ Sandblast

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 1.58:1 · APCA Lc 26

Fail

검은색 위

WCAG 13.28:1 · APCA Lc 77

AAA

가장 좋은 글자색: #000000

WCAG 13.28:1 (AAA) · APCA Lc 77

Contrast pairs

코드 스니펫

CSS

:root {
  --frost-fairy: #bbcfef;
  --frost-fairy-rgb: 187 207 239;
  --frost-fairy-oklch: oklch(0.85 0.05 259.8);
}

.element {
  color: var(--frost-fairy);
  background-color: hsl(217 62% 84%);
  border-color: oklch(0.85 0.05 259.8);
}

Tailwind CSS v4

@theme {
  --color-frost-fairy: #bbcfef;
  --color-frost-fairy-50: #edf6ff;
  --color-frost-fairy-100: #dfe8f9;
  --color-frost-fairy-200: #c9d5ea;
  --color-frost-fairy-300: #aab8d2;
  --color-frost-fairy-400: #8d9fbc;
  --color-frost-fairy-500: #7387a8;
  --color-frost-fairy-600: #61728e;
  --color-frost-fairy-700: #4e5b72;
  --color-frost-fairy-800: #384354;
  --color-frost-fairy-900: #262e3a;
  --color-frost-fairy-950: #141b24;
}

SCSS

$frost-fairy: #bbcfef;
$frost-fairy-rgb: 187, 207, 239;
$frost-fairy-light: mix(#fff, $frost-fairy, 20%);
$frost-fairy-dark: mix(#000, $frost-fairy, 20%);

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

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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