Nazwany kolor · #E0E2E0
Intrepid Grey
Intrepid Grey to #E0E2E0: rgb(224 226 224), hsl(120 3% 88%), oklch(0.911 0.003 145.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Intrepid Grey color name →
#E0E2E0
oklch(0.911 0.003 145.5)
Konwersje koloru
- HEX
- #e0e2e0
- RGB
- rgb(224 226 224)
- HSL
- hsl(120 3% 88%)
- HWB
- hwb(120 88% 11%)
- OKLCH
- oklch(0.911 0.003 145.5)
- OKLab
- oklab(0.911 -0.003 0.002)
- CIE Lab
- lab(89.68 -0.97 0.73)
- LCH
- lch(89.68 1.21 142.9)
- CMYK
- cmyk(1% 0% 1% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E3E5E3
- E6E8E6
- E9EBE9
- ECEEEC
- EFF0EF
- F3F3F3
- F6F6F6
- F9F9F9
- FCFCFC
Odcienie ciemniejsze
- C3C4C3
- A6A8A6
- 8A8C8A
- 707170
- 565756
- 3E3E3E
- 272727
- 121212
- 020302
Tony
- D6D8D6
- CCCECC
- C2C4C2
- B8BAB8
- AFB0AF
- A5A6A5
- 9C9C9C
- 929392
- 898989
Harmonie kolorów
Komplementarna +180°
- E0E2E0
Intrepid Grey
- E3E1E3
≈ Lavender Breeze
Analogowa -30° +30°
- E0E2E0
Intrepid Grey
- E1E2DF
≈ Intrepid Grey
- DFE2E1
≈ Intrepid Grey
Triada +120° +240°
- E0E2E0
Intrepid Grey
- E0E1E4
≈ January Dawn
- E4E1E0
≈ Spilled Cappuccino
Komplementarna rozszczepiona +150° +210°
- E0E2E0
Intrepid Grey
- E1E1E3
≈ Jupiter
- E3E0E1
≈ Jupiter
Tetrada +90° +180° +270°
- E0E2E0
Intrepid Grey
- DFE2E3
≈ Porcelain Jasper
- E3E1E3
≈ Lavender Breeze
- E3E1DF
≈ Spilled Cappuccino
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.30:1 · APCA Lc 15
Ag
AAANa czerni
WCAG 16.12:1 · APCA Lc 89
Najlepszy kolor tekstu: #000000
WCAG 16.12:1 (AAA) · APCA Lc 89
Contrast pairs
Fragmenty kodu
CSS
:root {
--intrepid-grey: #e0e2e0;
--intrepid-grey-rgb: 224 226 224;
--intrepid-grey-oklch: oklch(0.911 0.003 145.5);
}
.element {
color: var(--intrepid-grey);
background-color: hsl(120 3% 88%);
border-color: oklch(0.911 0.003 145.5);
}Tailwind CSS v4
@theme {
--color-intrepid-grey: #e0e2e0;
--color-intrepid-grey-50: #f4f5f4;
--color-intrepid-grey-100: #e7e8e7;
--color-intrepid-grey-200: #d3d4d3;
--color-intrepid-grey-300: #b6b8b6;
--color-intrepid-grey-400: #9d9f9d;
--color-intrepid-grey-500: #858785;
--color-intrepid-grey-600: #707270;
--color-intrepid-grey-700: #5a5b5a;
--color-intrepid-grey-800: #424342;
--color-intrepid-grey-900: #2d2e2d;
--color-intrepid-grey-950: #1a1b1a;
}SCSS
$intrepid-grey: #e0e2e0;
$intrepid-grey-rgb: 224, 226, 224;
$intrepid-grey-light: mix(#fff, $intrepid-grey, 20%);
$intrepid-grey-dark: mix(#000, $intrepid-grey, 20%);
.element {
color: $intrepid-grey;
box-shadow: 0 0 0 2px rgba($intrepid-grey, 0.35);
}