色名 · #E3D2DB
Mauve Aquarelle
Mauve Aquarelleは#E3D2DB：rgb(227 210 219)、hsl(328 23% 86%)、oklch(0.88 0.022 344.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Mauve Aquarelle color name →
#E3D2DB
oklch(0.88 0.022 344.3)
カラー変換
- HEX
- #e3d2db
- RGB
- rgb(227 210 219)
- HSL
- hsl(328 23% 86%)
- HWB
- hwb(328 82% 11%)
- OKLCH
- oklch(0.88 0.022 344.3)
- OKLab
- oklab(0.88 0.021 -0.006)
- CIE Lab
- lab(85.8 7.24 -2.22)
- LCH
- lch(85.8 7.57 342.9)
- CMYK
- cmyk(0% 7% 4% 11%)
ティント · シェード · トーン
ティント
- E6D6DF
- E9DBE2
- EBDFE6
- EEE4E9
- F1E8ED
- F4EDF0
- F7F1F4
- F9F6F8
- FCFAFB
シェード
- C5B6BE
- A89BA2
- 8C8187
- 71686D
- 575054
- 3F393C
- 272426
- 121011
- 030202
トーン
- D9C9D2
- CEC1C8
- C4B9BF
- BAB0B6
- B0A8AC
- A6A0A3
- 9D989A
- 939091
- 898889
カラーハーモニー
補色 +180°
- E3D2DB
Mauve Aquarelle
- CBDCD4
≈ Light Soft Celadon
類似色 -30° +30°
- E3D2DB
Mauve Aquarelle
- DDD3E2
≈ Tricot Lilac White
- E6D2D3
≈ Ash Cherry Blossom
トライアド +120° +240°
- E3D2DB
Mauve Aquarelle
- D9D9C8
≈ Stage Whisper
- C9DBE3
≈ Vanilla Ice Smoke
スプリットコンプリメンタリー +150° +210°
- E3D2DB
Mauve Aquarelle
- D2DBCC
≈ Ottoman
- C8DCDC
≈ Whispering Blue
テトラード +90° +180° +270°
- E3D2DB
Mauve Aquarelle
- E1D6C8
≈ Kestrel White
- CBDCD4
≈ Light Soft Celadon
- CED9E6
≈ Arctic Air
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.44:1 · APCA Lc 21
Ag
AAA黒の上
WCAG 14.50:1 · APCA Lc 82
最適な文字色: #000000
WCAG 14.50:1 (AAA) · APCA Lc 82
Contrast pairs
コードスニペット
CSS
:root {
--mauve-aquarelle: #e3d2db;
--mauve-aquarelle-rgb: 227 210 219;
--mauve-aquarelle-oklch: oklch(0.88 0.022 344.3);
}
.element {
color: var(--mauve-aquarelle);
background-color: hsl(328 23% 86%);
border-color: oklch(0.88 0.022 344.3);
}Tailwind CSS v4
@theme {
--color-mauve-aquarelle: #e3d2db;
--color-mauve-aquarelle-50: #faf3f6;
--color-mauve-aquarelle-100: #eee5e9;
--color-mauve-aquarelle-200: #dcd1d6;
--color-mauve-aquarelle-300: #c0b3ba;
--color-mauve-aquarelle-400: #a999a2;
--color-mauve-aquarelle-500: #92818a;
--color-mauve-aquarelle-600: #7b6d74;
--color-mauve-aquarelle-700: #63575d;
--color-mauve-aquarelle-800: #483f44;
--color-mauve-aquarelle-900: #322c2f;
--color-mauve-aquarelle-950: #1e191c;
}SCSS
$mauve-aquarelle: #e3d2db;
$mauve-aquarelle-rgb: 227, 210, 219;
$mauve-aquarelle-light: mix(#fff, $mauve-aquarelle, 20%);
$mauve-aquarelle-dark: mix(#000, $mauve-aquarelle, 20%);
.element {
color: $mauve-aquarelle;
box-shadow: 0 0 0 2px rgba($mauve-aquarelle, 0.35);
}