Benannte Farbe · #828344
Drab
Drab ist #828344: rgb(130 131 68), hsl(61 32% 39%), oklch(0.595 0.085 109.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Drab color name →
#828344
oklch(0.595 0.085 109.5)
Farbumrechnungen
- HEX
- #828344
- RGB
- rgb(130 131 68)
- HSL
- hsl(61 32% 39%)
- HWB
- hwb(61 27% 49%)
- OKLCH
- oklch(0.595 0.085 109.5)
- OKLab
- oklab(0.595 -0.029 0.08)
- CIE Lab
- lab(53.59 -7.46 33.62)
- LCH
- lch(53.59 34.44 102.5)
- CMYK
- cmyk(1% 0% 48% 49%)
Tints · Shades · Tones
Tints
- 8E8F57
- 999B69
- A6A77C
- B2B38E
- BEC0A0
- CBCCB3
- D8D9C6
- E5E5D9
- F2F2EC
Shades
- 70713A
- 5F6030
- 4E4F26
- 3E3F1D
- 2F2F14
- 20200C
- 121205
- 060602
- 010100
Tones
- 82834B
- 818352
- 818258
- 81825F
- 818265
- 81826A
- 808170
- 808175
- 80807B
Farbharmonien
Komplementär +180°
- 828344
Drab
- 7D76AE
≈ Purple Rhapsody
Analog -30° +30°
- 828344
Drab
- 9A7940
≈ Gold Estate
- 638B5A
≈ Hippie Green
Triadisch +120° +240°
Geteilt komplementär +150° +210°
- 828344
Drab
- 607FB2
≈ Prompt
- 956E9F
≈ Court Jester
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.97:1 · APCA Lc 67
Ag
AAAuf Schwarz
WCAG 5.27:1 · APCA Lc 35
Beste Textfarbe: #000000
WCAG 5.27:1 (AA) · APCA Lc 35
Contrast pairs
Code-Snippets
CSS
:root {
--drab: #828344;
--drab-rgb: 130 131 68;
--drab-oklch: oklch(0.595 0.085 109.5);
}
.element {
color: var(--drab);
background-color: hsl(61 32% 39%);
border-color: oklch(0.595 0.085 109.5);
}Tailwind CSS v4
@theme {
--color-drab: #828344;
--color-drab-50: #f5f8dc;
--color-drab-100: #e8ebcb;
--color-drab-200: #d5d8af;
--color-drab-300: #b8bc8a;
--color-drab-400: #a2a367;
--color-drab-500: #8a8b44;
--color-drab-600: #75763b;
--color-drab-700: #5d5e2e;
--color-drab-800: #454420;
--color-drab-900: #302f15;
--color-drab-950: #1c1c06;
}SCSS
$drab: #828344;
$drab-rgb: 130, 131, 68;
$drab-light: mix(#fff, $drab, 20%);
$drab-dark: mix(#000, $drab, 20%);
.element {
color: $drab;
box-shadow: 0 0 0 2px rgba($drab, 0.35);
}