Nazwany kolor · #4A0A00
Lonely Chocolate
Lonely Chocolate to #4A0A00: rgb(74 10 0), hsl(8 100% 15%), oklch(0.267 0.096 33.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Brown mean? → · Lonely Chocolate color name →
#4A0A00
oklch(0.267 0.096 33.8)
Konwersje koloru
- HEX
- #4a0a00
- RGB
- rgb(74 10 0)
- HSL
- hsl(8 100% 15%)
- HWB
- hwb(8 0% 71%)
- OKLCH
- oklch(0.267 0.096 33.8)
- OKLab
- oklab(0.267 0.08 0.054)
- CIE Lab
- lab(14.07 29.44 21.9)
- LCH
- lch(14.07 36.69 36.6)
- CMYK
- cmyk(0% 86% 100% 71%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 5D2417
- 6F3A2F
- 815146
- 93685E
- A58077
- B79891
- C9B1AB
- DBCBC7
- EDE5E3
Odcienie ciemniejsze
- 3F0700
- 350500
- 2A0300
- 200200
- 170100
- 0E0100
- 060000
- 020000
- 000000
Tony
- 51190D
- 57251A
- 5D3126
- 633C33
- 69473F
- 6E524C
- 735E59
- 776965
- 7C7473
Harmonie kolorów
Komplementarna +180°
- 4A0A00
Lonely Chocolate
- 002B33
≈ Daintree
Analogowa -30° +30°
- 4A0A00
Lonely Chocolate
- 480720
≈ What We Do in the Shadows
- 3A1E00
≈ Medium Roast
Triada +120° +240°
- 4A0A00
Lonely Chocolate
- 002F15
≈ Prasinophobia
- 191E53
≈ Fly-by-Night
Komplementarna rozszczepiona +150° +210°
- 4A0A00
Lonely Chocolate
- 002D28
≈ Guerrilla Forest
- 002843
≈ Murky Depths
Tetrada +90° +180° +270°
- 4A0A00
Lonely Chocolate
- 1F2B00
≈ Lindworm Green
- 002B33
≈ Daintree
- 30154B
≈ Russian Violet
Kontrast i dostępność
Ag
AAANa bieli
WCAG 15.73:1 · APCA Lc 102
Ag
FailNa czerni
WCAG 1.33:1 · APCA Lc 0
Najlepszy kolor tekstu: #FFFFFF
WCAG 15.73:1 (AAA) · APCA Lc 102
Contrast pairs
Fragmenty kodu
CSS
:root {
--lonely-chocolate: #4a0a00;
--lonely-chocolate-rgb: 74 10 0;
--lonely-chocolate-oklch: oklch(0.267 0.096 33.8);
}
.element {
color: var(--lonely-chocolate);
background-color: hsl(8 100% 15%);
border-color: oklch(0.267 0.096 33.8);
}Tailwind CSS v4
@theme {
--color-lonely-chocolate: #4a0a00;
--color-lonely-chocolate-50: #ffece3;
--color-lonely-chocolate-100: #ffddd2;
--color-lonely-chocolate-200: #fac6b8;
--color-lonely-chocolate-300: #e4a696;
--color-lonely-chocolate-400: #d18979;
--color-lonely-chocolate-500: #bd6d5b;
--color-lonely-chocolate-600: #a05d4d;
--color-lonely-chocolate-700: #804a3e;
--color-lonely-chocolate-800: #5f352d;
--color-lonely-chocolate-900: #43241e;
--color-lonely-chocolate-950: #2b130e;
}SCSS
$lonely-chocolate: #4a0a00;
$lonely-chocolate-rgb: 74, 10, 0;
$lonely-chocolate-light: mix(#fff, $lonely-chocolate, 20%);
$lonely-chocolate-dark: mix(#000, $lonely-chocolate, 20%);
.element {
color: $lonely-chocolate;
box-shadow: 0 0 0 2px rgba($lonely-chocolate, 0.35);
}