色名 · #ECD9CA
Nutmeg Frost
Nutmeg Frostは#ECD9CA：rgb(236 217 202)、hsl(26 47% 86%)、oklch(0.897 0.029 60.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Nutmeg Frost color name →
#ECD9CA
oklch(0.897 0.029 60.7)
カラー変換
- HEX
- #ecd9ca
- RGB
- rgb(236 217 202)
- HSL
- hsl(26 47% 86%)
- HWB
- hwb(26 79% 7%)
- OKLCH
- oklch(0.897 0.029 60.7)
- OKLab
- oklab(0.897 0.014 0.025)
- CIE Lab
- lab(87.96 4.97 9.91)
- LCH
- lch(87.96 11.09 63.4)
- CMYK
- cmyk(0% 8% 14% 7%)
ティント · シェード · トーン
ティント
- EEDDCF
- F0E1D4
- F2E4DA
- F4E8DF
- F6ECE4
- F7F0EA
- F9F4EF
- FBF7F4
- FDFBFA
シェード
- CDBCAF
- AFA195
- 92867C
- 766C64
- 5B534D
- 423B37
- 292522
- 13110F
- 030202
トーン
- E1D0C2
- D6C7BB
- CABDB3
- BFB4AC
- B5ABA4
- AAA39D
- 9F9A96
- 95918E
- 8A8987
カラーハーモニー
補色 +180°
- ECD9CA
Nutmeg Frost
- CDE0EF
≈ Vanishing Blue
類似色 -30° +30°
- ECD9CA
Nutmeg Frost
- F0D6D1
≈ Awe
- E4DDC8
≈ Lime Chalk
トライアド +120° +240°
- ECD9CA
Nutmeg Frost
- C9E4DE
≈ Moonlight Jade
- E0D9EE
≈ Chinese Silver
スプリットコンプリメンタリー +150° +210°
- ECD9CA
Nutmeg Frost
- C8E3E8
≈ Aviary Blue
- D5DCF1
≈ Blissful Meditation
テトラード +90° +180° +270°
- ECD9CA
Nutmeg Frost
- D0E3D3
≈ Minty Delight
- CDE0EF
≈ Vanishing Blue
- E9D6E6
≈ Pale Grey Magenta
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.36:1 · APCA Lc 18
Ag
AAA黒の上
WCAG 15.34:1 · APCA Lc 86
最適な文字色: #000000
WCAG 15.34:1 (AAA) · APCA Lc 86
Contrast pairs
コードスニペット
CSS
:root {
--nutmeg-frost: #ecd9ca;
--nutmeg-frost-rgb: 236 217 202;
--nutmeg-frost-oklch: oklch(0.897 0.029 60.7);
}
.element {
color: var(--nutmeg-frost);
background-color: hsl(26 47% 86%);
border-color: oklch(0.897 0.029 60.7);
}Tailwind CSS v4
@theme {
--color-nutmeg-frost: #ecd9ca;
--color-nutmeg-frost-50: #fbf3ed;
--color-nutmeg-frost-100: #efe6de;
--color-nutmeg-frost-200: #ded2c8;
--color-nutmeg-frost-300: #c3b4a8;
--color-nutmeg-frost-400: #ac9b8d;
--color-nutmeg-frost-500: #958273;
--color-nutmeg-frost-600: #7e6e61;
--color-nutmeg-frost-700: #65584e;
--color-nutmeg-frost-800: #4a4039;
--color-nutmeg-frost-900: #342c27;
--color-nutmeg-frost-950: #1f1915;
}SCSS
$nutmeg-frost: #ecd9ca;
$nutmeg-frost-rgb: 236, 217, 202;
$nutmeg-frost-light: mix(#fff, $nutmeg-frost, 20%);
$nutmeg-frost-dark: mix(#000, $nutmeg-frost, 20%);
.element {
color: $nutmeg-frost;
box-shadow: 0 0 0 2px rgba($nutmeg-frost, 0.35);
}