Nazwany kolor · #7B6F60
Groundbreaking
Groundbreaking to #7B6F60: rgb(123 111 96), hsl(33 12% 43%), oklch(0.548 0.027 73.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Groundbreaking color name →
#7B6F60
oklch(0.548 0.027 73.4)
Konwersje koloru
- HEX
- #7b6f60
- RGB
- rgb(123 111 96)
- HSL
- hsl(33 12% 43%)
- HWB
- hwb(33 38% 52%)
- OKLCH
- oklch(0.548 0.027 73.4)
- OKLab
- oklab(0.548 0.008 0.026)
- CIE Lab
- lab(47.64 2.9 10.18)
- LCH
- lch(47.64 10.59 74.1)
- CMYK
- cmyk(0% 10% 22% 52%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 877C6F
- 948A7E
- A1988D
- AEA69C
- BBB4AC
- C8C3BC
- D6D2CD
- E3E1DD
- F1F0EE
Odcienie ciemniejsze
- 6A6052
- 5A5145
- 4A4238
- 3A342C
- 2C2720
- 1E1A15
- 100E0A
- 050403
- 010100
Tony
- 7C7163
- 7C7266
- 7D746A
- 7D766D
- 7E7870
- 7E7973
- 7F7B76
- 7F7D7A
- 807E7D
Harmonie kolorów
Komplementarna +180°
- 7B6F60
Groundbreaking
- 667281
≈ Flintstone
Analogowa -30° +30°
- 7B6F60
Groundbreaking
- 7F6C65
≈ African Mud
- 747260
≈ Organic
Triada +120° +240°
- 7B6F60
Groundbreaking
- 5F7675
≈ Paradise City
- 776D7D
≈ Mamba
Komplementarna rozszczepiona +150° +210°
- 7B6F60
Groundbreaking
- 60757D
≈ Blue-Eyed Cryptid
- 6F6F81
≈ Old Mill Blue
Tetrada +90° +180° +270°
- 7B6F60
Groundbreaking
- 63766D
≈ Galena
- 667281
≈ Flintstone
- 7D6B75
≈ Purple Dusk
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.90:1 · APCA Lc 74
Ag
FailNa czerni
WCAG 4.28:1 · APCA Lc 28
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.90:1 (AA) · APCA Lc 74
Contrast pairs
Fragmenty kodu
CSS
:root {
--groundbreaking: #7b6f60;
--groundbreaking-rgb: 123 111 96;
--groundbreaking-oklch: oklch(0.548 0.027 73.4);
}
.element {
color: var(--groundbreaking);
background-color: hsl(33 12% 43%);
border-color: oklch(0.548 0.027 73.4);
}Tailwind CSS v4
@theme {
--color-groundbreaking: #7b6f60;
--color-groundbreaking-50: #faf4ed;
--color-groundbreaking-100: #ede7de;
--color-groundbreaking-200: #dbd3c8;
--color-groundbreaking-300: #c0b6a8;
--color-groundbreaking-400: #a89c8d;
--color-groundbreaking-500: #918473;
--color-groundbreaking-600: #7b7061;
--color-groundbreaking-700: #62594e;
--color-groundbreaking-800: #484138;
--color-groundbreaking-900: #322d27;
--color-groundbreaking-950: #1e1a15;
}SCSS
$groundbreaking: #7b6f60;
$groundbreaking-rgb: 123, 111, 96;
$groundbreaking-light: mix(#fff, $groundbreaking, 20%);
$groundbreaking-dark: mix(#000, $groundbreaking, 20%);
.element {
color: $groundbreaking;
box-shadow: 0 0 0 2px rgba($groundbreaking, 0.35);
}