最も近い色名 · #E2BEF3
#E2BEF3
最も近い色名: Beefy Pink
#E2BEF3(rgb(226 190 243)、hsl(281 69% 85%)、oklch(0.85 0.082 314.9))に最も近い色名はBeefy Pinkです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#E2BEF3
oklch(0.85 0.082 314.9)
カラー変換
- HEX
- #e2bef3
- RGB
- rgb(226 190 243)
- HSL
- hsl(281 69% 85%)
- HWB
- hwb(281 75% 5%)
- OKLCH
- oklch(0.85 0.082 314.9)
- OKLab
- oklab(0.85 0.058 -0.058)
- CIE Lab
- lab(81.44 20.24 -21.39)
- LCH
- lch(81.44 29.45 313.4)
- CMYK
- cmyk(7% 22% 0% 5%)
ティント · シェード · トーン
ティント
- E5C5F4
- E8CBF6
- EBD2F7
- EED8F8
- F1DFF9
- F4E5FB
- F6EBFC
- F9F2FD
- FCF8FE
シェード
- C4A5D3
- A88CB4
- 8C7597
- 715E7A
- 57485E
- 3E3344
- 271F2B
- 120D14
- 030203
トーン
- D8B8E7
- CEB1DB
- C4ABCF
- BAA5C4
- B09FB8
- A699AD
- 9C92A1
- 938C96
- 89868B
カラーハーモニー
補色 +180°
- E2BEF3
Beefy Pink
- B7DAA4
≈ Embroidered Silk
類似色 -30° +30°
- E2BEF3
Beefy Pink
- C8C7FF
≈ Light Periwinkle
- F5B9DA
≈ Manga Pink
トライアド +120° +240°
- E2BEF3
Beefy Pink
- EEC691
≈ Humble Gold
- 8BDFDE
≈ Paradisiacal Getaway
スプリットコンプリメンタリー +150° +210°
- E2BEF3
Beefy Pink
- D5D192
≈ Lemon Fennel
- 9ADFC0
≈ Birthday King
テトラード +90° +180° +270°
- E2BEF3
Beefy Pink
- FCBDA2
≈ Sweet Apricot
- B7DAA4
≈ Embroidered Silk
- 92DAF6
≈ Shiva Blue
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.62:1 · APCA Lc 28
Ag
AAA黒の上
WCAG 12.89:1 · APCA Lc 75
最適な文字色: #000000
WCAG 12.89:1 (AAA) · APCA Lc 75
Contrast pairs
コードスニペット
CSS
:root {
--beefy-pink: #e2bef3;
--beefy-pink-rgb: 226 190 243;
--beefy-pink-oklch: oklch(0.85 0.082 314.9);
}
.element {
color: var(--beefy-pink);
background-color: hsl(281 69% 85%);
border-color: oklch(0.85 0.082 314.9);
}Tailwind CSS v4
@theme {
--color-beefy-pink: #e2bef3;
--color-beefy-pink-50: #ffeeff;
--color-beefy-pink-100: #f3e0fb;
--color-beefy-pink-200: #e3caec;
--color-beefy-pink-300: #c9abd4;
--color-beefy-pink-400: #b190c0;
--color-beefy-pink-500: #9b75ac;
--color-beefy-pink-600: #836491;
--color-beefy-pink-700: #695074;
--color-beefy-pink-800: #4c3a57;
--color-beefy-pink-900: #35283d;
--color-beefy-pink-950: #201626;
}SCSS
$beefy-pink: #e2bef3;
$beefy-pink-rgb: 226, 190, 243;
$beefy-pink-light: mix(#fff, $beefy-pink, 20%);
$beefy-pink-dark: mix(#000, $beefy-pink, 20%);
.element {
color: $beefy-pink;
box-shadow: 0 0 0 2px rgba($beefy-pink, 0.35);
}