色名 · #E2E3DF
Beryl Pearl
Beryl Pearlは#E2E3DF：rgb(226 227 223)、hsl(75 7% 88%)、oklch(0.914 0.005 117.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Beryl Pearl color name →
#E2E3DF
oklch(0.914 0.005 117.9)
カラー変換
- HEX
- #e2e3df
- RGB
- rgb(226 227 223)
- HSL
- hsl(75 7% 88%)
- HWB
- hwb(75 87% 11%)
- OKLCH
- oklch(0.914 0.005 117.9)
- OKLab
- oklab(0.914 -0.003 0.005)
- CIE Lab
- lab(90.07 -0.88 1.83)
- LCH
- lch(90.07 2.03 115.6)
- CMYK
- cmyk(0% 0% 2% 11%)
ティント · シェード · トーン
ティント
- E5E6E2
- E8E9E5
- EBEBE9
- EEEEEC
- F0F1EF
- F3F4F2
- F6F7F5
- F9F9F9
- FCFCFC
シェード
- C4C5C2
- A8A8A5
- 8C8C8A
- 71716F
- 575756
- 3E3F3D
- 272727
- 121212
- 030302
トーン
- D8D9D5
- CECECB
- C4C4C2
- BABAB8
- B0B0AE
- A6A6A5
- 9C9D9B
- 939392
- 898989
カラーハーモニー
補色 +180°
- E2E3DF
Beryl Pearl
- E3E2E6
≈ Wallflower White
類似色 -30° +30°
- E2E3DF
Beryl Pearl
- E4E2DE
≈ Quiet on the Set
- E0E4E0
≈ Illuminating Experience
トライアド +120° +240°
- E2E3DF
Beryl Pearl
- DFE3E6
≈ January Dawn
- E6E1E2
≈ Easter Orchid
スプリットコンプリメンタリー +150° +210°
- E2E3DF
Beryl Pearl
- E1E2E6
≈ Soothing White
- E5E1E4
≈ Orchid Blossom
テトラード +90° +180° +270°
- E2E3DF
Beryl Pearl
- DFE4E4
≈ Moon Garden
- E3E2E6
≈ Wallflower White
- E6E1E0
≈ Mauve Tinge
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.28:1 · APCA Lc 14
Ag
AAA黒の上
WCAG 16.28:1 · APCA Lc 89
最適な文字色: #000000
WCAG 16.28:1 (AAA) · APCA Lc 89
Contrast pairs
コードスニペット
CSS
:root {
--beryl-pearl: #e2e3df;
--beryl-pearl-rgb: 226 227 223;
--beryl-pearl-oklch: oklch(0.914 0.005 117.9);
}
.element {
color: var(--beryl-pearl);
background-color: hsl(75 7% 88%);
border-color: oklch(0.914 0.005 117.9);
}Tailwind CSS v4
@theme {
--color-beryl-pearl: #e2e3df;
--color-beryl-pearl-50: #f5f5f4;
--color-beryl-pearl-100: #e7e8e6;
--color-beryl-pearl-200: #d4d4d2;
--color-beryl-pearl-300: #b7b8b5;
--color-beryl-pearl-400: #9e9f9b;
--color-beryl-pearl-500: #868783;
--color-beryl-pearl-600: #71726f;
--color-beryl-pearl-700: #5a5b58;
--color-beryl-pearl-800: #424340;
--color-beryl-pearl-900: #2e2e2c;
--color-beryl-pearl-950: #1a1b19;
}SCSS
$beryl-pearl: #e2e3df;
$beryl-pearl-rgb: 226, 227, 223;
$beryl-pearl-light: mix(#fff, $beryl-pearl, 20%);
$beryl-pearl-dark: mix(#000, $beryl-pearl, 20%);
.element {
color: $beryl-pearl;
box-shadow: 0 0 0 2px rgba($beryl-pearl, 0.35);
}