Nazwany kolor · #7C7D75
Attitude Grey
Attitude Grey to #7C7D75: rgb(124 125 117), hsl(67 3% 47%), oklch(0.586 0.012 112.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Attitude Grey color name →
#7C7D75
oklch(0.586 0.012 112.5)
Konwersje koloru
- HEX
- #7c7d75
- RGB
- rgb(124 125 117)
- HSL
- hsl(67 3% 47%)
- HWB
- hwb(67 46% 51%)
- OKLCH
- oklch(0.586 0.012 112.5)
- OKLab
- oklab(0.586 -0.005 0.011)
- CIE Lab
- lab(52.14 -1.55 4.24)
- LCH
- lch(52.14 4.52 110.1)
- CMYK
- cmyk(1% 0% 6% 51%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 888982
- 95968F
- A1A29C
- AEAFAA
- BBBCB8
- C9C9C6
- D6D6D4
- E3E4E2
- F1F1F0
Odcienie ciemniejsze
- 6B6C65
- 5A5B55
- 4A4B46
- 3B3B37
- 2C2C29
- 1E1E1C
- 11110F
- 050505
- 010101
Tony
- 7C7D76
- 7D7E77
- 7D7E78
- 7E7E79
- 7E7F7B
- 7E7F7C
- 7F7F7D
- 7F7F7E
- 80807F
Harmonie kolorów
Komplementarna +180°
- 7C7D75
Attitude Grey
- 7C7B83
≈ Silver Filigree
Analogowa -30° +30°
- 7C7D75
Attitude Grey
- 807C74
≈ Ricochet
- 787E78
≈ Selenium
Triada +120° +240°
- 7C7D75
Attitude Grey
- 757E82
≈ Peak Point
- 82797D
≈ Storm Front
Komplementarna rozszczepiona +150° +210°
- 7C7D75
Attitude Grey
- 787C84
≈ Nocturnal
- 807A80
≈ Storm Front
Tetrada +90° +180° +270°
- 7C7D75
Attitude Grey
- 747E7F
≈ Hidden Peak
- 7C7B83
≈ Silver Filigree
- 837A79
≈ Mule
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.16:1 · APCA Lc 69
Ag
AANa czerni
WCAG 5.04:1 · APCA Lc 33
Najlepszy kolor tekstu: #000000
WCAG 5.04:1 (AA) · APCA Lc 33
Contrast pairs
Fragmenty kodu
CSS
:root {
--attitude-grey: #7c7d75;
--attitude-grey-rgb: 124 125 117;
--attitude-grey-oklch: oklch(0.586 0.012 112.5);
}
.element {
color: var(--attitude-grey);
background-color: hsl(67 3% 47%);
border-color: oklch(0.586 0.012 112.5);
}Tailwind CSS v4
@theme {
--color-attitude-grey: #7c7d75;
--color-attitude-grey-50: #f5f5f2;
--color-attitude-grey-100: #e8e8e4;
--color-attitude-grey-200: #d4d5cf;
--color-attitude-grey-300: #b7b8b1;
--color-attitude-grey-400: #9e9f97;
--color-attitude-grey-500: #86877e;
--color-attitude-grey-600: #71726b;
--color-attitude-grey-700: #5b5b55;
--color-attitude-grey-800: #42433e;
--color-attitude-grey-900: #2e2e2b;
--color-attitude-grey-950: #1b1b18;
}SCSS
$attitude-grey: #7c7d75;
$attitude-grey-rgb: 124, 125, 117;
$attitude-grey-light: mix(#fff, $attitude-grey, 20%);
$attitude-grey-dark: mix(#000, $attitude-grey, 20%);
.element {
color: $attitude-grey;
box-shadow: 0 0 0 2px rgba($attitude-grey, 0.35);
}