色名 · #EAC8DA
Merry Pink
Merry Pinkは#EAC8DA：rgb(234 200 218)、hsl(328 45% 85%)、oklch(0.867 0.045 344.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Merry Pink color name →
#EAC8DA
oklch(0.867 0.045 344.9)
カラー変換
- HEX
- #eac8da
- RGB
- rgb(234 200 218)
- HSL
- hsl(328 45% 85%)
- HWB
- hwb(328 78% 8%)
- OKLCH
- oklch(0.867 0.045 344.9)
- OKLab
- oklab(0.867 0.043 -0.012)
- CIE Lab
- lab(83.95 14.58 -4.29)
- LCH
- lch(83.95 15.2 343.6)
- CMYK
- cmyk(0% 15% 7% 8%)
ティント · シェード · トーン
ティント
- ECCDDE
- EED3E1
- F1D8E5
- F3DEE9
- F5E3EC
- F7E9F0
- F9EEF4
- FBF4F8
- FDF9FB
シェード
- CBAEBD
- AE94A2
- 917B87
- 75636C
- 5A4C54
- 41363C
- 292125
- 130F11
- 030202
トーン
- DFC1D1
- D4B9C7
- C9B2BE
- BEABB5
- B4A3AC
- A99CA3
- 9F959A
- 948E91
- 8A8789
カラーハーモニー
補色 +180°
- EAC8DA
Merry Pink
- B9DDCC
≈ Mirador
類似色 -30° +30°
- EAC8DA
Merry Pink
- DFCBE8
≈ Syrian Violet
- EFC8CA
≈ Salmon Flush
トライアド +120° +240°
- EAC8DA
Merry Pink
- D7D5B4
≈ Chinese Silk
- B5DAEA
≈ Minified Blue
スプリットコンプリメンタリー +150° +210°
- EAC8DA
Merry Pink
- C7DABD
≈ Crocodile Dreams
- B2DDDC
≈ Minerva
テトラード +90° +180° +270°
- EAC8DA
Merry Pink
- E5D0B3
≈ Blonde Wool
- B9DDCC
≈ Mirador
- C0D5F1
≈ Mr. Glass
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.52:1 · APCA Lc 24
Ag
AAA黒の上
WCAG 13.77:1 · APCA Lc 79
最適な文字色: #000000
WCAG 13.77:1 (AAA) · APCA Lc 79
Contrast pairs
コードスニペット
CSS
:root {
--merry-pink: #eac8da;
--merry-pink-rgb: 234 200 218;
--merry-pink-oklch: oklch(0.867 0.045 344.9);
}
.element {
color: var(--merry-pink);
background-color: hsl(328 45% 85%);
border-color: oklch(0.867 0.045 344.9);
}Tailwind CSS v4
@theme {
--color-merry-pink: #eac8da;
--color-merry-pink-50: #fff0f8;
--color-merry-pink-100: #f4e2eb;
--color-merry-pink-200: #e4cdd8;
--color-merry-pink-300: #caafbc;
--color-merry-pink-400: #b394a5;
--color-merry-pink-500: #9d7b8d;
--color-merry-pink-600: #846877;
--color-merry-pink-700: #6a535f;
--color-merry-pink-800: #4e3c46;
--color-merry-pink-900: #362931;
--color-merry-pink-950: #21171d;
}SCSS
$merry-pink: #eac8da;
$merry-pink-rgb: 234, 200, 218;
$merry-pink-light: mix(#fff, $merry-pink, 20%);
$merry-pink-dark: mix(#000, $merry-pink, 20%);
.element {
color: $merry-pink;
box-shadow: 0 0 0 2px rgba($merry-pink, 0.35);
}