色名 · #E4E4DD
Spare White
Spare Whiteは#E4E4DD：rgb(228 228 221)、hsl(60 11% 88%)、oklch(0.917 0.009 106.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Spare White color name →
#E4E4DD
oklch(0.917 0.009 106.6)
カラー変換
- HEX
- #e4e4dd
- RGB
- rgb(228 228 221)
- HSL
- hsl(60 11% 88%)
- HWB
- hwb(60 87% 11%)
- OKLCH
- oklch(0.917 0.009 106.6)
- OKLab
- oklab(0.917 -0.003 0.009)
- CIE Lab
- lab(90.44 -0.92 3.43)
- LCH
- lch(90.44 3.55 105)
- CMYK
- cmyk(0% 0% 3% 11%)
ティント · シェード · トーン
ティント
- E7E7E0
- E9E9E4
- ECECE7
- EFEFEB
- F1F1EE
- F4F4F1
- F7F7F5
- FAFAF8
- FCFCFC
シェード
- C6C6C0
- A9A9A4
- 8D8D88
- 72726E
- 585855
- 3F3F3D
- 282826
- 121211
- 030302
トーン
- DADAD3
- CFCFCA
- C5C5C0
- BBBBB7
- B1B1AD
- A7A7A4
- 9D9D9B
- 939392
- 8A8A89
カラーハーモニー
補色 +180°
- E4E4DD
Spare White
- E3E3EA
≈ Lady’s Slipper
類似色 -30° +30°
- E4E4DD
Spare White
- E7E3DD
≈ Wild Sand
- E1E5DF
≈ Chinese White
トライアド +120° +240°
- E4E4DD
Spare White
- DDE5E8
≈ Elusive Blue
- E9E1E5
≈ Lavender Pizzazz
スプリットコンプリメンタリー +150° +210°
- E4E4DD
Spare White
- E0E4EA
≈ Silver City
- E6E2E8
≈ Violet Hush
テトラード +90° +180° +270°
- E4E4DD
Spare White
- DDE6E5
≈ Cameo Green
- E3E3EA
≈ Lady’s Slipper
- EAE1E1
≈ Milk and Cookies
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.27:1 · APCA Lc 14
Ag
AAA黒の上
WCAG 16.44:1 · APCA Lc 90
最適な文字色: #000000
WCAG 16.44:1 (AAA) · APCA Lc 90
Contrast pairs
コードスニペット
CSS
:root {
--spare-white: #e4e4dd;
--spare-white-rgb: 228 228 221;
--spare-white-oklch: oklch(0.917 0.009 106.6);
}
.element {
color: var(--spare-white);
background-color: hsl(60 11% 88%);
border-color: oklch(0.917 0.009 106.6);
}Tailwind CSS v4
@theme {
--color-spare-white: #e4e4dd;
--color-spare-white-50: #f5f5f2;
--color-spare-white-100: #e8e8e5;
--color-spare-white-200: #d4d4d0;
--color-spare-white-300: #b7b8b2;
--color-spare-white-400: #9f9f99;
--color-spare-white-500: #878780;
--color-spare-white-600: #72726c;
--color-spare-white-700: #5b5b56;
--color-spare-white-800: #43433f;
--color-spare-white-900: #2e2e2b;
--color-spare-white-950: #1b1b19;
}SCSS
$spare-white: #e4e4dd;
$spare-white-rgb: 228, 228, 221;
$spare-white-light: mix(#fff, $spare-white, 20%);
$spare-white-dark: mix(#000, $spare-white, 20%);
.element {
color: $spare-white;
box-shadow: 0 0 0 2px rgba($spare-white, 0.35);
}