Najbliższy nazwany kolor · #4B1F1B
#4B1F1B
Najbliższy nazwany kolor: Torrefacto Roast
#4B1F1B (rgb(75 31 27), hsl(5 47% 20%), oklch(0.302 0.068 27.1)) jest najbliższy nazwanemu kolorowi Torrefacto Roast. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#4B1F1B
oklch(0.302 0.068 27.1)
Konwersje koloru
- HEX
- #4b1f1b
- RGB
- rgb(75 31 27)
- HSL
- hsl(5 47% 20%)
- HWB
- hwb(5 11% 71%)
- OKLCH
- oklch(0.302 0.068 27.1)
- OKLab
- oklab(0.302 0.06 0.031)
- CIE Lab
- lab(18.43 21.05 13.21)
- LCH
- lch(18.43 24.85 32.1)
- CMYK
- cmyk(0% 59% 64% 71%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 5D332E
- 6E4743
- 805C58
- 92726E
- A38884
- B59F9C
- C8B6B4
- DACECC
- ECE6E5
Odcienie ciemniejsze
- 401916
- 351411
- 2B0F0C
- 210A08
- 170605
- 0E0302
- 060101
- 020000
- 000000
Tony
- 512924
- 57322E
- 5C3C38
- 624541
- 674F4B
- 6D5856
- 726260
- 776C6A
- 7B7675
Harmonie kolorów
Komplementarna +180°
- 4B1F1B
Torrefacto Roast
- 00353C
≈ Artist Blue
Analogowa -30° +30°
- 4B1F1B
Torrefacto Roast
- 481E2F
≈ Dark Mahogany
- 472405
≈ Ibex Brown
Triada +120° +240°
- 4B1F1B
Torrefacto Roast
- 133719
≈ Gameboy Contrast
- 1F2C50
≈ Pico Void
Komplementarna rozszczepiona +150° +210°
- 4B1F1B
Torrefacto Roast
- 00372E
≈ Night Turquoise
- 00324B
≈ Cosmos Blue
Tetrada +90° +180° +270°
- 4B1F1B
Torrefacto Roast
- 2C3202
≈ Wasabi Nori
- 00353C
≈ Artist Blue
- 32264C
≈ Cardinal Mauve
Kontrast i dostępność
Ag
AAANa bieli
WCAG 13.89:1 · APCA Lc 100
Ag
FailNa czerni
WCAG 1.51:1 · APCA Lc 0
Najlepszy kolor tekstu: #FFFFFF
WCAG 13.89:1 (AAA) · APCA Lc 100
Contrast pairs
Fragmenty kodu
CSS
:root {
--torrefacto-roast: #4b1f1b;
--torrefacto-roast-rgb: 75 31 27;
--torrefacto-roast-oklch: oklch(0.302 0.068 27.1);
}
.element {
color: var(--torrefacto-roast);
background-color: hsl(5 47% 20%);
border-color: oklch(0.302 0.068 27.1);
}Tailwind CSS v4
@theme {
--color-torrefacto-roast: #4b1f1b;
--color-torrefacto-roast-50: #ffeeea;
--color-torrefacto-roast-100: #fee0db;
--color-torrefacto-roast-200: #f0cac4;
--color-torrefacto-roast-300: #d8aba4;
--color-torrefacto-roast-400: #c48f89;
--color-torrefacto-roast-500: #af756e;
--color-torrefacto-roast-600: #94635d;
--color-torrefacto-roast-700: #764f4a;
--color-torrefacto-roast-800: #583936;
--color-torrefacto-roast-900: #3d2725;
--color-torrefacto-roast-950: #271514;
}SCSS
$torrefacto-roast: #4b1f1b;
$torrefacto-roast-rgb: 75, 31, 27;
$torrefacto-roast-light: mix(#fff, $torrefacto-roast, 20%);
$torrefacto-roast-dark: mix(#000, $torrefacto-roast, 20%);
.element {
color: $torrefacto-roast;
box-shadow: 0 0 0 2px rgba($torrefacto-roast, 0.35);
}