最も近い色名 · #DCEFDE
#DCEFDE
最も近い色名: Vanishing Point
#DCEFDE（rgb(220 239 222)、hsl(126 37% 90%)、oklch(0.933 0.03 148.4)）に最も近い色名はVanishing Pointです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#DCEFDE
oklch(0.933 0.03 148.4)
カラー変換
- HEX
- #dcefde
- RGB
- rgb(220 239 222)
- HSL
- hsl(126 37% 90%)
- HWB
- hwb(126 86% 6%)
- OKLCH
- oklch(0.933 0.03 148.4)
- OKLab
- oklab(0.933 -0.026 0.016)
- CIE Lab
- lab(92.68 -8.81 6)
- LCH
- lch(92.68 10.66 145.7)
- CMYK
- cmyk(8% 0% 7% 6%)
ティント · シェード · トーン
ティント
- DFF1E1
- E3F2E5
- E6F4E8
- EAF5EB
- EDF7EE
- F1F9F2
- F4FAF5
- F8FCF8
- FBFDFC
シェード
- BFD0C1
- A3B1A5
- 889489
- 6E786F
- 545C55
- 3C423D
- 262A26
- 111412
- 020302
トーン
- D2E3D4
- C9D8CA
- C0CCC1
- B6C1B7
- ADB6AE
- A4ABA4
- 9BA09B
- 929592
- 898B89
カラーハーモニー
補色 +180°
- DCEFDE
Vanishing Point
- F5E2F3
≈ Minute Mauve
類似色 -30° +30°
- DCEFDE
Vanishing Point
- E7ECD6
≈ Lime Meringue
- D5F0E9
≈ Green Frosting
トライアド +120° +240°
- DCEFDE
Vanishing Point
- E0E9FE
≈ Glitter
- FDE2DE
≈ Lady Anne
スプリットコンプリメンタリー +150° +210°
- DCEFDE
Vanishing Point
- EBE5FB
≈ Cyber Lavender
- FBE1E9
≈ Watermelon Mousse
テトラード +90° +180° +270°
- DCEFDE
Vanishing Point
- D7ECFB
≈ Ice Castle
- F5E2F3
≈ Minute Mauve
- F9E5D6
≈ Shell Ginger
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.20:1 · APCA Lc 10
Ag
AAA黒の上
WCAG 17.44:1 · APCA Lc 94
最適な文字色: #000000
WCAG 17.44:1 (AAA) · APCA Lc 94
Contrast pairs
コードスニペット
CSS
:root {
--vanishing-point: #dcefde;
--vanishing-point-rgb: 220 239 222;
--vanishing-point-oklch: oklch(0.933 0.03 148.4);
}
.element {
color: var(--vanishing-point);
background-color: hsl(126 37% 90%);
border-color: oklch(0.933 0.03 148.4);
}Tailwind CSS v4
@theme {
--color-vanishing-point: #dcefde;
--color-vanishing-point-50: #eff8f1;
--color-vanishing-point-100: #e1ebe3;
--color-vanishing-point-200: #ccd8ce;
--color-vanishing-point-300: #adbcaf;
--color-vanishing-point-400: #93a495;
--color-vanishing-point-500: #798c7b;
--color-vanishing-point-600: #677668;
--color-vanishing-point-700: #525f53;
--color-vanishing-point-800: #3c453c;
--color-vanishing-point-900: #293029;
--color-vanishing-point-950: #171c17;
}SCSS
$vanishing-point: #dcefde;
$vanishing-point-rgb: 220, 239, 222;
$vanishing-point-light: mix(#fff, $vanishing-point, 20%);
$vanishing-point-dark: mix(#000, $vanishing-point, 20%);
.element {
color: $vanishing-point;
box-shadow: 0 0 0 2px rgba($vanishing-point, 0.35);
}