Nazwany kolor · #B8B2BE
Titmouse Grey
Titmouse Grey to #B8B2BE: rgb(184 178 190), hsl(270 8% 72%), oklch(0.772 0.018 308.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Titmouse Grey color name →
#B8B2BE
oklch(0.772 0.018 308.2)
Konwersje koloru
- HEX
- #b8b2be
- RGB
- rgb(184 178 190)
- HSL
- hsl(270 8% 72%)
- HWB
- hwb(270 70% 25%)
- OKLCH
- oklch(0.772 0.018 308.2)
- OKLab
- oklab(0.772 0.011 -0.014)
- CIE Lab
- lab(73.35 3.88 -5.33)
- LCH
- lch(73.35 6.59 306.1)
- CMYK
- cmyk(3% 6% 0% 25%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BFB9C4
- C6C1CB
- CDC9D1
- D4D0D8
- DBD8DE
- E2E0E5
- E9E7EB
- F0EFF2
- F8F7F8
Odcienie ciemniejsze
- A09AA5
- 88838C
- 716D75
- 5B575E
- 454348
- 312F33
- 1E1D1F
- 0C0C0D
- 020102
Tony
- B2ADB8
- ADA8B1
- A7A3AB
- A19EA5
- 9C999E
- 969498
- 908F92
- 8B8A8C
- 858586
Harmonie kolorów
Komplementarna +180°
- B8B2BE
Titmouse Grey
- B1B7AB
≈ Dewkissed Rain
Analogowa -30° +30°
- B8B2BE
Titmouse Grey
- B2B4C1
≈ Fading Sunset
- BDB1B9
≈ Heather Hill
Triada +120° +240°
- B8B2BE
Titmouse Grey
- BDB3A9
≈ Heavy Warm Grey
- A9B9B7
≈ Bidwell Blue
Komplementarna rozszczepiona +150° +210°
- B8B2BE
Titmouse Grey
- B8B5A8
≈ Soulful Grey
- ACB9B1
≈ Stratton Blue
Tetrada +90° +180° +270°
- B8B2BE
Titmouse Grey
- C0B1AD
≈ Oak Ridge
- B1B7AB
≈ Dewkissed Rain
- A9B8BD
≈ Half Sea Fog
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.06:1 · APCA Lc 40
Ag
AAANa czerni
WCAG 10.14:1 · APCA Lc 62
Najlepszy kolor tekstu: #000000
WCAG 10.14:1 (AAA) · APCA Lc 62
Contrast pairs
Fragmenty kodu
CSS
:root {
--titmouse-grey: #b8b2be;
--titmouse-grey-rgb: 184 178 190;
--titmouse-grey-oklch: oklch(0.772 0.018 308.2);
}
.element {
color: var(--titmouse-grey);
background-color: hsl(270 8% 72%);
border-color: oklch(0.772 0.018 308.2);
}Tailwind CSS v4
@theme {
--color-titmouse-grey: #b8b2be;
--color-titmouse-grey-50: #f7f4f9;
--color-titmouse-grey-100: #eae6ec;
--color-titmouse-grey-200: #d6d2da;
--color-titmouse-grey-300: #bab5be;
--color-titmouse-grey-400: #a19ca7;
--color-titmouse-grey-500: #898390;
--color-titmouse-grey-600: #746f79;
--color-titmouse-grey-700: #5d5961;
--color-titmouse-grey-800: #444147;
--color-titmouse-grey-900: #2f2d31;
--color-titmouse-grey-950: #1b1a1d;
}SCSS
$titmouse-grey: #b8b2be;
$titmouse-grey-rgb: 184, 178, 190;
$titmouse-grey-light: mix(#fff, $titmouse-grey, 20%);
$titmouse-grey-dark: mix(#000, $titmouse-grey, 20%);
.element {
color: $titmouse-grey;
box-shadow: 0 0 0 2px rgba($titmouse-grey, 0.35);
}