Nazwany kolor · #B8BFB1
Hazel Gaze
Hazel Gaze to #B8BFB1: rgb(184 191 177), hsl(90 10% 72%), oklch(0.795 0.021 128.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Hazel Gaze color name →
#B8BFB1
oklch(0.795 0.021 128.8)
Konwersje koloru
- HEX
- #b8bfb1
- RGB
- rgb(184 191 177)
- HSL
- hsl(90 10% 72%)
- HWB
- hwb(90 69% 25%)
- OKLCH
- oklch(0.795 0.021 128.8)
- OKLab
- oklab(0.795 -0.013 0.016)
- CIE Lab
- lab(76.48 -4.43 6.21)
- LCH
- lch(76.48 7.63 125.5)
- CMYK
- cmyk(4% 0% 7% 25%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BFC5B9
- C6CCC0
- CDD2C8
- D4D8D0
- DBDFD7
- E2E5DF
- E9EBE7
- F0F2EF
- F8F8F7
Odcienie ciemniejsze
- A0A699
- 888D83
- 71756C
- 5B5E57
- 454842
- 31332F
- 1E1F1C
- 0C0D0C
- 020201
Tony
- B2B9AC
- ADB2A7
- A7ACA2
- A1A59D
- 9C9F98
- 969993
- 90928E
- 8B8C8A
- 858685
Harmonie kolorów
Komplementarna +180°
- B8BFB1
Hazel Gaze
- C0B9C7
≈ Silverberry
Analogowa -30° +30°
- B8BFB1
Hazel Gaze
- BFBDAE
≈ Sapless Green
- B2C1B7
≈ April Thicket
Triada +120° +240°
- B8BFB1
Hazel Gaze
- B2BEC9
≈ Winter Wonderland
- C9B7B9
≈ Studio Mauve
Komplementarna rozszczepiona +150° +210°
- B8BFB1
Hazel Gaze
- B9BBCA
≈ Cosmic
- C6B7C1
≈ Pocketful of Posies
Tetrada +90° +180° +270°
- B8BFB1
Hazel Gaze
- AEC0C5
≈ Artisan Blue
- C0B9C7
≈ Silverberry
- C9B8B3
≈ Subdue Red
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.88:1 · APCA Lc 36
Ag
AAANa czerni
WCAG 11.12:1 · APCA Lc 67
Najlepszy kolor tekstu: #000000
WCAG 11.12:1 (AAA) · APCA Lc 67
Contrast pairs
Fragmenty kodu
CSS
:root {
--hazel-gaze: #b8bfb1;
--hazel-gaze-rgb: 184 191 177;
--hazel-gaze-oklch: oklch(0.795 0.021 128.8);
}
.element {
color: var(--hazel-gaze);
background-color: hsl(90 10% 72%);
border-color: oklch(0.795 0.021 128.8);
}Tailwind CSS v4
@theme {
--color-hazel-gaze: #b8bfb1;
--color-hazel-gaze-50: #f3f6f0;
--color-hazel-gaze-100: #e5e9e2;
--color-hazel-gaze-200: #d1d6cd;
--color-hazel-gaze-300: #b4baaf;
--color-hazel-gaze-400: #9ba194;
--color-hazel-gaze-500: #82897b;
--color-hazel-gaze-600: #6e7468;
--color-hazel-gaze-700: #585d53;
--color-hazel-gaze-800: #40443c;
--color-hazel-gaze-900: #2c2f29;
--color-hazel-gaze-950: #191b17;
}SCSS
$hazel-gaze: #b8bfb1;
$hazel-gaze-rgb: 184, 191, 177;
$hazel-gaze-light: mix(#fff, $hazel-gaze, 20%);
$hazel-gaze-dark: mix(#000, $hazel-gaze, 20%);
.element {
color: $hazel-gaze;
box-shadow: 0 0 0 2px rgba($hazel-gaze, 0.35);
}