Nazwany kolor · #E6E0E3
Pearl Violet
Pearl Violet to #E6E0E3: rgb(230 224 227), hsl(330 11% 89%), oklch(0.912 0.008 345.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Pearl Violet color name →
#E6E0E3
oklch(0.912 0.008 345.4)
Konwersje koloru
- HEX
- #e6e0e3
- RGB
- rgb(230 224 227)
- HSL
- hsl(330 11% 89%)
- HWB
- hwb(330 88% 10%)
- OKLCH
- oklch(0.912 0.008 345.4)
- OKLab
- oklab(0.912 0.007 -0.002)
- CIE Lab
- lab(89.72 2.5 -0.71)
- LCH
- lch(89.72 2.6 344.2)
- CMYK
- cmyk(0% 3% 1% 10%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E8E3E6
- EBE6E9
- EDE9EB
- F0ECEE
- F2EFF1
- F5F3F4
- F7F6F7
- FAF9F9
- FCFCFC
Odcienie ciemniejsze
- C8C3C5
- ABA6A8
- 8E8A8C
- 737071
- 595657
- 403E3F
- 282727
- 131212
- 030203
Tony
- DBD6D9
- D1CCCE
- C6C2C4
- BCB8BA
- B2AFB0
- A7A5A6
- 9D9C9D
- 949293
- 8A8989
Harmonie kolorów
Komplementarna +180°
- E6E0E3
Pearl Violet
- DEE4E1
≈ Illuminating Experience
Analogowa -30° +30°
- E6E0E3
Pearl Violet
- E4E0E5
≈ Budapest Pastel
- E7E0E0
≈ Mountain Air
Triada +120° +240°
- E6E0E3
Pearl Violet
- E2E2DD
≈ Quiet on the Set
- DDE3E6
≈ Cold Light
Komplementarna rozszczepiona +150° +210°
- E6E0E3
Pearl Violet
- E0E3DE
≈ Barely White
- DDE4E3
≈ Dewdrop
Tetrada +90° +180° +270°
- E6E0E3
Pearl Violet
- E5E1DD
≈ Storksbill
- DEE4E1
≈ Illuminating Experience
- DFE2E7
≈ White Iris
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.30:1 · APCA Lc 15
Ag
AAANa czerni
WCAG 16.13:1 · APCA Lc 89
Najlepszy kolor tekstu: #000000
WCAG 16.13:1 (AAA) · APCA Lc 89
Contrast pairs
Fragmenty kodu
CSS
:root {
--pearl-violet: #e6e0e3;
--pearl-violet-rgb: 230 224 227;
--pearl-violet-oklch: oklch(0.912 0.008 345.4);
}
.element {
color: var(--pearl-violet);
background-color: hsl(330 11% 89%);
border-color: oklch(0.912 0.008 345.4);
}Tailwind CSS v4
@theme {
--color-pearl-violet: #e6e0e3;
--color-pearl-violet-50: #f7f4f5;
--color-pearl-violet-100: #eae7e8;
--color-pearl-violet-200: #d7d3d5;
--color-pearl-violet-300: #bab6b8;
--color-pearl-violet-400: #a29d9f;
--color-pearl-violet-500: #8a8487;
--color-pearl-violet-600: #757072;
--color-pearl-violet-700: #5d595b;
--color-pearl-violet-800: #444143;
--color-pearl-violet-900: #2f2d2e;
--color-pearl-violet-950: #1c1a1b;
}SCSS
$pearl-violet: #e6e0e3;
$pearl-violet-rgb: 230, 224, 227;
$pearl-violet-light: mix(#fff, $pearl-violet, 20%);
$pearl-violet-dark: mix(#000, $pearl-violet, 20%);
.element {
color: $pearl-violet;
box-shadow: 0 0 0 2px rgba($pearl-violet, 0.35);
}