Nazwany kolor · #B0B1AC
Plymouth Grey
Plymouth Grey to #B0B1AC: rgb(176 177 172), hsl(72 3% 68%), oklch(0.758 0.007 115.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Plymouth Grey color name →
#B0B1AC
oklch(0.758 0.007 115.8)
Konwersje koloru
- HEX
- #b0b1ac
- RGB
- rgb(176 177 172)
- HSL
- hsl(72 3% 68%)
- HWB
- hwb(72 67% 31%)
- OKLCH
- oklch(0.758 0.007 115.8)
- OKLab
- oklab(0.758 -0.003 0.006)
- CIE Lab
- lab(72.01 -1.06 2.44)
- LCH
- lch(72.01 2.65 113.5)
- CMYK
- cmyk(1% 0% 3% 31%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B8B9B4
- BFC0BC
- C7C8C4
- CFD0CC
- D7D7D5
- DFDFDD
- E7E7E5
- EFEFEE
- F7F7F6
Odcienie ciemniejsze
- 999995
- 82837F
- 6C6C69
- 565754
- 424240
- 2E2F2D
- 1C1C1B
- 0B0C0B
- 010101
Tony
- ABACA7
- A6A7A3
- A1A29F
- 9C9D9A
- 989896
- 939391
- 8E8E8D
- 898A89
- 858584
Harmonie kolorów
Komplementarna +180°
- B0B1AC
Plymouth Grey
- B1B0B5
≈ Harbour Fog
Analogowa -30° +30°
- B0B1AC
Plymouth Grey
- B2B0AB
≈ Bashful Emu
- AEB2AE
≈ Fynbos Leaf
Triada +120° +240°
- B0B1AC
Plymouth Grey
- ACB1B4
≈ Silver Charm
- B4AFB0
≈ Kid Gloves
Komplementarna rozszczepiona +150° +210°
- B0B1AC
Plymouth Grey
- AEB0B5
≈ Silver Charm
- B3AFB3
≈ Swanky Grey
Tetrada +90° +180° +270°
- B0B1AC
Plymouth Grey
- ACB2B3
≈ High Rise
- B1B0B5
≈ Harbour Fog
- B5AFAE
≈ Kid Gloves
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.15:1 · APCA Lc 42
Ag
AAANa czerni
WCAG 9.73:1 · APCA Lc 60
Najlepszy kolor tekstu: #000000
WCAG 9.73:1 (AAA) · APCA Lc 60
Contrast pairs
Fragmenty kodu
CSS
:root {
--plymouth-grey: #b0b1ac;
--plymouth-grey-rgb: 176 177 172;
--plymouth-grey-oklch: oklch(0.758 0.007 115.8);
}
.element {
color: var(--plymouth-grey);
background-color: hsl(72 3% 68%);
border-color: oklch(0.758 0.007 115.8);
}Tailwind CSS v4
@theme {
--color-plymouth-grey: #b0b1ac;
--color-plymouth-grey-50: #f5f5f3;
--color-plymouth-grey-100: #e7e8e5;
--color-plymouth-grey-200: #d4d5d1;
--color-plymouth-grey-300: #b7b8b4;
--color-plymouth-grey-400: #9e9f9a;
--color-plymouth-grey-500: #868781;
--color-plymouth-grey-600: #71726e;
--color-plymouth-grey-700: #5a5b58;
--color-plymouth-grey-800: #424340;
--color-plymouth-grey-900: #2e2e2c;
--color-plymouth-grey-950: #1a1b19;
}SCSS
$plymouth-grey: #b0b1ac;
$plymouth-grey-rgb: 176, 177, 172;
$plymouth-grey-light: mix(#fff, $plymouth-grey, 20%);
$plymouth-grey-dark: mix(#000, $plymouth-grey, 20%);
.element {
color: $plymouth-grey;
box-shadow: 0 0 0 2px rgba($plymouth-grey, 0.35);
}