最も近い色名 · #CAF7EF
#CAF7EF
最も近い色名: Glacial Drift
#CAF7EF（rgb(202 247 239)、hsl(169 74% 88%)、oklch(0.942 0.047 183.3)）に最も近い色名はGlacial Driftです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#CAF7EF
oklch(0.942 0.047 183.3)
カラー変換
- HEX
- #caf7ef
- RGB
- rgb(202 247 239)
- HSL
- hsl(169 74% 88%)
- HWB
- hwb(169 79% 3%)
- OKLCH
- oklch(0.942 0.047 183.3)
- OKLab
- oklab(0.942 -0.047 -0.003)
- CIE Lab
- lab(93.91 -16.11 -1.17)
- LCH
- lch(93.91 16.15 184.2)
- CMYK
- cmyk(18% 0% 3% 3%)
ティント · シェード · トーン
ティント
- D0F8F1
- D5F9F2
- DAFAF4
- E0FAF5
- E5FBF7
- EAFCF9
- F0FDFA
- F5FDFC
- FAFEFD
シェード
- AFD7D0
- 95B7B1
- 7C9994
- 647C78
- 4D605C
- 374542
- 222C2A
- 0F1514
- 020303
トーン
- C3EBE3
- BBDED8
- B4D2CC
- ACC6C1
- A5BAB6
- 9DAEAB
- 96A2A0
- 8F9795
- 878B8B
カラーハーモニー
補色 +180°
- CAF7EF
Glacial Drift
- FFE4EA
≈ Early Blossom
類似色 -30° +30°
- CAF7EF
Glacial Drift
- D5F6DD
≈ Fennel Tea
- C9F5FF
≈ Vaporised
トライアド +120° +240°
- CAF7EF
Glacial Drift
- F0E7FF
≈ Bright Dusk
- FFE7D3
≈ Mood Lighting
スプリットコンプリメンタリー +150° +210°
- CAF7EF
Glacial Drift
- FFE2F9
≈ Fairy Salt
- FFE6E0
≈ Olm Pink
テトラード +90° +180° +270°
- CAF7EF
Glacial Drift
- E6EBFF
≈ Icy Lilac
- FFE4EA
≈ Early Blossom
- F7ECC9
≈ Shiny Silk
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.16:1 · APCA Lc 8
Ag
AAA黒の上
WCAG 18.06:1 · APCA Lc 97
最適な文字色: #000000
WCAG 18.06:1 (AAA) · APCA Lc 97
Contrast pairs
コードスニペット
CSS
:root {
--glacial-drift: #caf7ef;
--glacial-drift-rgb: 202 247 239;
--glacial-drift-oklch: oklch(0.942 0.047 183.3);
}
.element {
color: var(--glacial-drift);
background-color: hsl(169 74% 88%);
border-color: oklch(0.942 0.047 183.3);
}Tailwind CSS v4
@theme {
--color-glacial-drift: #caf7ef;
--color-glacial-drift-50: #e7faf7;
--color-glacial-drift-100: #d7edea;
--color-glacial-drift-200: #bfdbd7;
--color-glacial-drift-300: #9dc0bb;
--color-glacial-drift-400: #80a8a1;
--color-glacial-drift-500: #629189;
--color-glacial-drift-600: #537a74;
--color-glacial-drift-700: #42625d;
--color-glacial-drift-800: #304843;
--color-glacial-drift-900: #20322e;
--color-glacial-drift-950: #101e1b;
}SCSS
$glacial-drift: #caf7ef;
$glacial-drift-rgb: 202, 247, 239;
$glacial-drift-light: mix(#fff, $glacial-drift, 20%);
$glacial-drift-dark: mix(#000, $glacial-drift, 20%);
.element {
color: $glacial-drift;
box-shadow: 0 0 0 2px rgba($glacial-drift, 0.35);
}