Nazwany kolor · #4B373C
Jube
Jube to #4B373C: rgb(75 55 60), hsl(345 15% 25%), oklch(0.361 0.03 2.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Jube color name →
#4B373C
oklch(0.361 0.03 2.1)
Konwersje koloru
- HEX
- #4b373c
- RGB
- rgb(75 55 60)
- HSL
- hsl(345 15% 25%)
- HWB
- hwb(345 22% 71%)
- OKLCH
- oklch(0.361 0.03 2.1)
- OKLab
- oklab(0.361 0.03 0.001)
- CIE Lab
- lab(25.5 9.86 0.52)
- LCH
- lch(25.5 9.88 3)
- CMYK
- cmyk(0% 27% 20% 71%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 5B494D
- 6C5B5F
- 7D6E71
- 8F8184
- A19598
- B3A9AB
- C6BEC0
- D8D3D4
- ECE9EA
Odcienie ciemniejsze
- 402E33
- 35262A
- 2B1E21
- 211619
- 170F11
- 0E080A
- 060304
- 020101
- 000000
Tony
- 503E42
- 564549
- 5B4C4F
- 605356
- 655A5D
- 6B6264
- 70696B
- 757172
- 7B7879
Harmonie kolorów
Komplementarna +180°
- 4B373C
Jube
- 2C433E
≈ Westhaven
Analogowa -30° +30°
- 4B373C
Jube
- 473844
≈ Vincotto
- 4C3834
≈ Brown Beauty
Triada +120° +240°
- 4B373C
Jube
- 3B402F
≈ Kombu Green
- 303F4C
≈ Deepsea Core
Komplementarna rozszczepiona +150° +210°
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
AAANa bieli
WCAG 10.98:1 · APCA Lc 95
Ag
FailNa czerni
WCAG 1.91:1 · APCA Lc 0
Najlepszy kolor tekstu: #FFFFFF
WCAG 10.98:1 (AAA) · APCA Lc 95
Contrast pairs
Fragmenty kodu
CSS
:root {
--jube: #4b373c;
--jube-rgb: 75 55 60;
--jube-oklch: oklch(0.361 0.03 2.1);
}
.element {
color: var(--jube);
background-color: hsl(345 15% 25%);
border-color: oklch(0.361 0.03 2.1);
}Tailwind CSS v4
@theme {
--color-jube: #4b373c;
--color-jube-50: #fdf2f4;
--color-jube-100: #f1e4e7;
--color-jube-200: #e0cfd3;
--color-jube-300: #c5b1b5;
--color-jube-400: #ae989d;
--color-jube-500: #987e84;
--color-jube-600: #806b70;
--color-jube-700: #67565a;
--color-jube-800: #4b3e42;
--color-jube-900: #342b2d;
--color-jube-950: #20181a;
}SCSS
$jube: #4b373c;
$jube-rgb: 75, 55, 60;
$jube-light: mix(#fff, $jube, 20%);
$jube-dark: mix(#000, $jube, 20%);
.element {
color: $jube;
box-shadow: 0 0 0 2px rgba($jube, 0.35);
}