色名 · #D6E5E2

Cave Pearl

Cave Pearlは#D6E5E2：rgb(214 229 226)、hsl(168 22% 87%)、oklch(0.91 0.017 182.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Gray mean? → · Cave Pearl color name →

#D6E5E2

oklch(0.91 0.017 182.7)

カラー変換

HEX: #d6e5e2
RGB: rgb(214 229 226)
HSL: hsl(168 22% 87%)
HWB: hwb(168 84% 10%)
OKLCH: oklch(0.91 0.017 182.7)
OKLab: oklab(0.91 -0.016 -0.001)
CIE Lab: lab(89.74 -5.59 -0.35)
LCH: lch(89.74 5.6 183.5)
CMYK: cmyk(7% 0% 1% 10%)

ティント · シェード · トーン

ティント

DAE8E5
DEEAE8
E2EDEB
E6EFEE
EAF2F0
EFF5F3
F3F7F6
F7FAF9
FBFCFC

シェード

BAC7C4
9EAAA8
848E8C
6A7271
525857
3B3F3E
252827
101212
020303

トーン

CDDAD8
C4D0CE
BBC6C4
B3BBBA
AAB1B0
A1A7A6
999D9C
919393
888A89

カラーハーモニー

補色 +180°

D6E5E2
Cave Pearl
EBDDE0
≈ Mauve Wisp

類似色 -30° +30°

トライアド +120° +240°

スプリットコンプリメンタリー +150° +210°

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 1.29:1 · APCA Lc 15

Fail

黒の上

WCAG 16.16:1 · APCA Lc 89

AAA

最適な文字色: #000000

WCAG 16.16:1 (AAA) · APCA Lc 89

Contrast pairs

コードスニペット

CSS

:root {
  --cave-pearl: #d6e5e2;
  --cave-pearl-rgb: 214 229 226;
  --cave-pearl-oklch: oklch(0.91 0.017 182.7);
}

.element {
  color: var(--cave-pearl);
  background-color: hsl(168 22% 87%);
  border-color: oklch(0.91 0.017 182.7);
}

Tailwind CSS v4

@theme {
  --color-cave-pearl: #d6e5e2;
  --color-cave-pearl-50: #f0f7f6;
  --color-cave-pearl-100: #e2eae8;
  --color-cave-pearl-200: #cdd7d5;
  --color-cave-pearl-300: #afbab8;
  --color-cave-pearl-400: #94a29f;
  --color-cave-pearl-500: #7b8a87;
  --color-cave-pearl-600: #687572;
  --color-cave-pearl-700: #535d5b;
  --color-cave-pearl-800: #3c4443;
  --color-cave-pearl-900: #2a2f2e;
  --color-cave-pearl-950: #171c1b;
}

SCSS

$cave-pearl: #d6e5e2;
$cave-pearl-rgb: 214, 229, 226;
$cave-pearl-light: mix(#fff, $cave-pearl, 20%);
$cave-pearl-dark: mix(#000, $cave-pearl, 20%);

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

近い色名

Palettes with similar colors

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API