Named color · #795D34
Breen
Breen is #795D34: rgb(121 93 52), hsl(36 40% 34%), oklch(0.497 0.068 75.6). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Brown mean? → · Breen color name →
#795D34
oklch(0.497 0.068 75.6)
Color conversions
- HEX
- #795d34
- RGB
- rgb(121 93 52)
- HSL
- hsl(36 40% 34%)
- HWB
- hwb(36 20% 53%)
- OKLCH
- oklch(0.497 0.068 75.6)
- OKLab
- oklab(0.497 0.017 0.066)
- CIE Lab
- lab(41.7 7.95 27.92)
- LCH
- lch(41.7 29.03 74.1)
- CMYK
- cmyk(0% 23% 57% 53%)
Tints · Shades · Tones
Tints
- 866C48
- 937B5B
- A08B6E
- AD9B82
- BAAB96
- C8BBAB
- D5CCBF
- E3DDD4
- F1EEE9
Shades
- 68502C
- 584324
- 48371C
- 392A15
- 2B1F0E
- 1D1407
- 100A03
- 050301
- 010000
Tones
- 7A613C
- 7B6444
- 7B684C
- 7C6B54
- 7D6F5B
- 7E7263
- 7E766A
- 7F7971
- 7F7D79
Color harmonies
Complementary +180°
- 795D34
Breen
- 486489
≈ French Mirage Blue
Analogous -30° +30°
Triadic +120° +240°
- 795D34
Breen
- 2A6F6F
≈ Blue Hosta
- 72577D
≈ Mystical
Split-complementary +150° +210°
- 795D34
Breen
- 326B80
≈ Kimberley Sea
- 5F5D88
≈ Purple Balloon
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAOn white
WCAG 6.12:1 · APCA Lc 80
Ag
FailOn black
WCAG 3.42:1 · APCA Lc 21
Best text color: #FFFFFF
WCAG 6.12:1 (AA) · APCA Lc 80
Contrast pairs
Code snippets
CSS
:root {
--breen: #795d34;
--breen-rgb: 121 93 52;
--breen-oklch: oklch(0.497 0.068 75.6);
}
.element {
color: var(--breen);
background-color: hsl(36 40% 34%);
border-color: oklch(0.497 0.068 75.6);
}Tailwind CSS v4
@theme {
--color-breen: #795d34;
--color-breen-50: #fff3e0;
--color-breen-100: #f5e6cf;
--color-breen-200: #e5d1b4;
--color-breen-300: #cbb491;
--color-breen-400: #b69971;
--color-breen-500: #a08051;
--color-breen-600: #886c46;
--color-breen-700: #6d5737;
--color-breen-800: #513f27;
--color-breen-900: #382b1a;
--color-breen-950: #23180b;
}SCSS
$breen: #795d34;
$breen-rgb: 121, 93, 52;
$breen-light: mix(#fff, $breen, 20%);
$breen-dark: mix(#000, $breen, 20%);
.element {
color: $breen;
box-shadow: 0 0 0 2px rgba($breen, 0.35);
}