色名 · #E7CCCD
Mauve Morn
Mauve Mornは#E7CCCD：rgb(231 204 205)、hsl(358 36% 85%)、oklch(0.868 0.03 15.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Mauve Morn color name →
#E7CCCD
oklch(0.868 0.03 15.2)
カラー変換
- HEX
- #e7cccd
- RGB
- rgb(231 204 205)
- HSL
- hsl(358 36% 85%)
- HWB
- hwb(358 80% 9%)
- OKLCH
- oklch(0.868 0.03 15.2)
- OKLab
- oklab(0.868 0.029 0.008)
- CIE Lab
- lab(84.36 9.89 3.16)
- LCH
- lch(84.36 10.38 17.7)
- CMYK
- cmyk(0% 12% 11% 9%)
ティント · シェード · トーン
ティント
- E9D1D2
- ECD6D7
- EEDBDC
- F1E0E1
- F3E5E6
- F6EAEB
- F8F0F0
- FAF5F5
- FDFAFA
シェード
- C9B1B2
- AB9798
- 8F7E7E
- 736566
- 594E4E
- 403738
- 282223
- 130F0F
- 030202
トーン
- DCC4C5
- D2BCBD
- C7B5B5
- BDADAD
- B2A5A6
- A89E9E
- 9E9696
- 948F8F
- 8A8787
カラーハーモニー
補色 +180°
- E7CCCD
Mauve Morn
- BEDADA
≈ Misty Aqua
類似色 -30° +30°
- E7CCCD
Mauve Morn
- E3CCD8
≈ Cassia Buds
- E6CEC3
≈ Malibu Coast
トライアド +120° +240°
- E7CCCD
Mauve Morn
- CBD8C5
≈ Spring Valley
- C7D5E8
≈ Light Penna
スプリットコンプリメンタリー +150° +210°
- E7CCCD
Mauve Morn
- C2DACF
≈ Fuchsite
- BFD8E3
≈ Distant Shore
テトラード +90° +180° +270°
- E7CCCD
Mauve Morn
- D6D5BF
≈ Pale Lichen
- BEDADA
≈ Misty Aqua
- D1D1E7
≈ Artistic Violet
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.50:1 · APCA Lc 24
Ag
AAA黒の上
WCAG 13.91:1 · APCA Lc 79
最適な文字色: #000000
WCAG 13.91:1 (AAA) · APCA Lc 79
Contrast pairs
コードスニペット
CSS
:root {
--mauve-morn: #e7cccd;
--mauve-morn-rgb: 231 204 205;
--mauve-morn-oklch: oklch(0.868 0.03 15.2);
}
.element {
color: var(--mauve-morn);
background-color: hsl(358 36% 85%);
border-color: oklch(0.868 0.03 15.2);
}Tailwind CSS v4
@theme {
--color-mauve-morn: #e7cccd;
--color-mauve-morn-50: #fef2f2;
--color-mauve-morn-100: #f2e4e4;
--color-mauve-morn-200: #e1cfcf;
--color-mauve-morn-300: #c7b2b2;
--color-mauve-morn-400: #b09898;
--color-mauve-morn-500: #997e80;
--color-mauve-morn-600: #826b6c;
--color-mauve-morn-700: #685656;
--color-mauve-morn-800: #4c3e3f;
--color-mauve-morn-900: #352b2c;
--color-mauve-morn-950: #201819;
}SCSS
$mauve-morn: #e7cccd;
$mauve-morn-rgb: 231, 204, 205;
$mauve-morn-light: mix(#fff, $mauve-morn, 20%);
$mauve-morn-dark: mix(#000, $mauve-morn, 20%);
.element {
color: $mauve-morn;
box-shadow: 0 0 0 2px rgba($mauve-morn, 0.35);
}