Nazwany kolor · #6E7A7C
Winter Could Grey
Winter Could Grey to #6E7A7C: rgb(110 122 124), hsl(189 6% 46%), oklch(0.57 0.015 208.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Winter Could Grey color name →
#6E7A7C
oklch(0.57 0.015 208.7)
Konwersje koloru
- HEX
- #6e7a7c
- RGB
- rgb(110 122 124)
- HSL
- hsl(189 6% 46%)
- HWB
- hwb(189 43% 51%)
- OKLCH
- oklch(0.57 0.015 208.7)
- OKLab
- oklab(0.57 -0.013 -0.007)
- CIE Lab
- lab(50.27 -4.29 -2.7)
- LCH
- lch(50.27 5.07 212.2)
- CMYK
- cmyk(11% 2% 0% 51%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 7C8688
- 899395
- 97A0A1
- A5ADAE
- B4BABB
- C3C8C9
- D1D5D6
- E0E3E3
- F0F1F1
Odcienie ciemniejsze
- 5F696B
- 50595A
- 41494A
- 333A3B
- 262B2C
- 191D1E
- 0E1011
- 040505
- 010101
Tony
- 707B7C
- 727B7D
- 737C7D
- 757C7E
- 777D7E
- 797E7E
- 7B7E7F
- 7C7F7F
- 7E7F80
Harmonie kolorów
Komplementarna +180°
- 6E7A7C
Winter Could Grey
- 807472
≈ Zircon Grey
Analogowa -30° +30°
- 6E7A7C
Winter Could Grey
- 6F7A77
≈ Green Dusk
- 70797F
≈ Iron Frost
Triada +120° +240°
- 6E7A7C
Winter Could Grey
- 7D747C
≈ Plush Velvet
- 7B776E
≈ Slippery Shale
Komplementarna rozszczepiona +150° +210°
- 6E7A7C
Winter Could Grey
- 7F7477
≈ Pumice Grey
- 7E766F
≈ Tadpole
Tetrada +90° +180° +270°
- 6E7A7C
Winter Could Grey
- 78767F
≈ Hawk Grey
- 807472
≈ Zircon Grey
- 76796F
≈ Green Jeans
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.43:1 · APCA Lc 71
Ag
AANa czerni
WCAG 4.73:1 · APCA Lc 31
Najlepszy kolor tekstu: #000000
WCAG 4.73:1 (AA) · APCA Lc 31
Contrast pairs
Fragmenty kodu
CSS
:root {
--winter-could-grey: #6e7a7c;
--winter-could-grey-rgb: 110 122 124;
--winter-could-grey-oklch: oklch(0.57 0.015 208.7);
}
.element {
color: var(--winter-could-grey);
background-color: hsl(189 6% 46%);
border-color: oklch(0.57 0.015 208.7);
}Tailwind CSS v4
@theme {
--color-winter-could-grey: #6e7a7c;
--color-winter-could-grey-50: #f1f6f7;
--color-winter-could-grey-100: #e3e9eb;
--color-winter-could-grey-200: #cdd6d8;
--color-winter-could-grey-300: #afbabc;
--color-winter-could-grey-400: #95a1a3;
--color-winter-could-grey-500: #7c898b;
--color-winter-could-grey-600: #697476;
--color-winter-could-grey-700: #545d5e;
--color-winter-could-grey-800: #3d4445;
--color-winter-could-grey-900: #2a2f30;
--color-winter-could-grey-950: #171b1c;
}SCSS
$winter-could-grey: #6e7a7c;
$winter-could-grey-rgb: 110, 122, 124;
$winter-could-grey-light: mix(#fff, $winter-could-grey, 20%);
$winter-could-grey-dark: mix(#000, $winter-could-grey, 20%);
.element {
color: $winter-could-grey;
box-shadow: 0 0 0 2px rgba($winter-could-grey, 0.35);
}