色名 · #EADDD7
Wistful Beige
Wistful Beigeは#EADDD7：rgb(234 221 215)、hsl(19 31% 88%)、oklch(0.906 0.017 46.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Wistful Beige color name →
#EADDD7
oklch(0.906 0.017 46.6)
カラー変換
- HEX
- #eaddd7
- RGB
- rgb(234 221 215)
- HSL
- hsl(19 31% 88%)
- HWB
- hwb(19 84% 8%)
- OKLCH
- oklch(0.906 0.017 46.6)
- OKLab
- oklab(0.906 0.011 0.012)
- CIE Lab
- lab(89.05 3.85 4.63)
- LCH
- lch(89.05 6.02 50.3)
- CMYK
- cmyk(0% 6% 8% 8%)
ティント · シェード · トーン
ティント
- ECE0DB
- EEE4DF
- F0E7E3
- F2EBE7
- F5EEEB
- F7F1EF
- F9F5F3
- FBF8F7
- FDFCFB
シェード
- CBC0BB
- AEA49F
- 918885
- 756E6B
- 5A5552
- 413D3B
- 292625
- 131111
- 030202
トーン
- DFD3CE
- D4CAC5
- C9C0BC
- BEB7B3
- B4ADAA
- A9A4A2
- 9F9B99
- 949291
- 8A8988
カラーハーモニー
補色 +180°
- EADDD7
Wistful Beige
- D5E3E9
≈ Bare Mintimum
類似色 -30° +30°
- EADDD7
Wistful Beige
- EBDCDC
≈ Discrete Pink
- E6DFD4
≈ White Coffee
トライアド +120° +240°
- EADDD7
Wistful Beige
- D6E4DE
≈ Fizzle
- DFDFEB
≈ Timid Purple
スプリットコンプリメンタリー +150° +210°
- EADDD7
Wistful Beige
- D4E4E4
≈ Waterfront
- D9E1EB
≈ Violet Vignette
テトラード +90° +180° +270°
- EADDD7
Wistful Beige
- DBE3D8
≈ Eye of the Storm
- D5E3E9
≈ Bare Mintimum
- E5DDE8
≈ Orchid Lane
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.32:1 · APCA Lc 16
Ag
AAA黒の上
WCAG 15.82:1 · APCA Lc 88
最適な文字色: #000000
WCAG 15.82:1 (AAA) · APCA Lc 88
Contrast pairs
コードスニペット
CSS
:root {
--wistful-beige: #eaddd7;
--wistful-beige-rgb: 234 221 215;
--wistful-beige-oklch: oklch(0.906 0.017 46.6);
}
.element {
color: var(--wistful-beige);
background-color: hsl(19 31% 88%);
border-color: oklch(0.906 0.017 46.6);
}Tailwind CSS v4
@theme {
--color-wistful-beige: #eaddd7;
--color-wistful-beige-50: #f9f4f1;
--color-wistful-beige-100: #ede6e3;
--color-wistful-beige-200: #dad2ce;
--color-wistful-beige-300: #bfb5b0;
--color-wistful-beige-400: #a79c96;
--color-wistful-beige-500: #90837d;
--color-wistful-beige-600: #7a6f6a;
--color-wistful-beige-700: #615955;
--color-wistful-beige-800: #48413e;
--color-wistful-beige-900: #322d2a;
--color-wistful-beige-950: #1e1a18;
}SCSS
$wistful-beige: #eaddd7;
$wistful-beige-rgb: 234, 221, 215;
$wistful-beige-light: mix(#fff, $wistful-beige, 20%);
$wistful-beige-dark: mix(#000, $wistful-beige, 20%);
.element {
color: $wistful-beige;
box-shadow: 0 0 0 2px rgba($wistful-beige, 0.35);
}