Named color · #48452B
Tin Bitz
Tin Bitz is #48452B: rgb(72 69 43), hsl(54 25% 23%), oklch(0.386 0.041 102.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Tin Bitz color name →
#48452B
oklch(0.386 0.041 102.5)
Color conversions
- HEX
- #48452b
- RGB
- rgb(72 69 43)
- HSL
- hsl(54 25% 23%)
- HWB
- hwb(54 17% 72%)
- OKLCH
- oklch(0.386 0.041 102.5)
- OKLab
- oklab(0.386 -0.009 0.04)
- CIE Lab
- lab(29.04 -2.11 16.21)
- LCH
- lch(29.04 16.35 97.4)
- CMYK
- cmyk(0% 4% 40% 72%)
Tints · Shades · Tones
Tints
- 58563E
- 696751
- 7A7865
- 8C8B7A
- 9E9D8F
- B1B0A4
- C4C3BA
- D7D7D1
- EBEBE8
Shades
- 3D3B24
- 33311D
- 292716
- 1F1E10
- 16150A
- 0D0C05
- 060502
- 020201
- 000000
Tones
- 4D4B33
- 53503C
- 585644
- 5E5C4C
- 636255
- 69685D
- 6F6E66
- 74746E
- 7A7A77
Color harmonies
Complementary +180°
- 48452B
Tin Bitz
- 40415A
≈ Amphystine
Analogous -30° +30°
- 48452B
Tin Bitz
- 52412B
≈ Deep Bronze
- 3C4932
≈ Rifle Green
Triadic +120° +240°
- 48452B
Tin Bitz
- 2A4954
≈ Night Swim
- 543B4A
≈ Purple Sphinx
Split-complementary +150° +210°
- 48452B
Tin Bitz
- 34455A
≈ Pickled Bluewood
- 4C3E54
≈ Sweet Grape
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAAOn white
WCAG 9.71:1 · APCA Lc 93
Ag
FailOn black
WCAG 2.16:1 · APCA Lc 10
Best text color: #FFFFFF
WCAG 9.71:1 (AAA) · APCA Lc 93
Contrast pairs
Code snippets
CSS
:root {
--tin-bitz: #48452b;
--tin-bitz-rgb: 72 69 43;
--tin-bitz-oklch: oklch(0.386 0.041 102.5);
}
.element {
color: var(--tin-bitz);
background-color: hsl(54 25% 23%);
border-color: oklch(0.386 0.041 102.5);
}Tailwind CSS v4
@theme {
--color-tin-bitz: #48452b;
--color-tin-bitz-50: #f7f6e9;
--color-tin-bitz-100: #eae9d9;
--color-tin-bitz-200: #d7d5c2;
--color-tin-bitz-300: #bab9a1;
--color-tin-bitz-400: #a3a084;
--color-tin-bitz-500: #8b8868;
--color-tin-bitz-600: #767359;
--color-tin-bitz-700: #5e5c47;
--color-tin-bitz-800: #454333;
--color-tin-bitz-900: #302e22;
--color-tin-bitz-950: #1c1b12;
}SCSS
$tin-bitz: #48452b;
$tin-bitz-rgb: 72, 69, 43;
$tin-bitz-light: mix(#fff, $tin-bitz, 20%);
$tin-bitz-dark: mix(#000, $tin-bitz, 20%);
.element {
color: $tin-bitz;
box-shadow: 0 0 0 2px rgba($tin-bitz, 0.35);
}