Benannte Farbe · #D4AE7E
Whole Grain
Whole Grain ist #D4AE7E: rgb(212 174 126), hsl(33 50% 66%), oklch(0.773 0.077 72.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Whole Grain color name →
#D4AE7E
oklch(0.773 0.077 72.8)
Farbumrechnungen
- HEX
- #d4ae7e
- RGB
- rgb(212 174 126)
- HSL
- hsl(33 50% 66%)
- HWB
- hwb(33 49% 17%)
- OKLCH
- oklch(0.773 0.077 72.8)
- OKLab
- oklab(0.773 0.023 0.074)
- CIE Lab
- lab(73.71 9.56 30.13)
- LCH
- lch(73.71 31.61 72.4)
- CMYK
- cmyk(0% 18% 41% 17%)
Tints · Shades · Tones
Tints
- D8B68B
- DDBE98
- E1C6A5
- E6CEB2
- EAD6BE
- EEDECB
- F2E7D8
- F7EFE5
- FBF7F2
Shades
- B8976D
- 9D805C
- 836A4C
- 69553C
- 51412D
- 3A2E1F
- 241C11
- 100B05
- 020101
Tones
- CBA97F
- C3A57F
- BAA080
- B29C80
- A99780
- A19281
- 998E81
- 908981
- 888580
Farbharmonien
Komplementär +180°
- D4AE7E
Whole Grain
- 92B9E6
≈ Adrift on the Nile
Analog -30° +30°
- D4AE7E
Whole Grain
- E0A68E
≈ Rose Tattoo
- BEB87E
≈ Slippery Moss
Triadisch +120° +240°
- D4AE7E
Whole Grain
- 77C5C3
≈ Booty Bay
- C7A7D9
≈ Perfume
Geteilt komplementär +150° +210°
- D4AE7E
Whole Grain
- 7CC1D9
≈ Ocean Horizon
- AEB0E6
≈ Maximum Blue Purple
Tetradisch +90° +180° +270°
- D4AE7E
Whole Grain
- 87C5A7
≈ Aqua Eden
- 92B9E6
≈ Adrift on the Nile
- D9A2C3
≈ Pastel Lavender
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.06:1 · APCA Lc 40
Ag
AAAAuf Schwarz
WCAG 10.15:1 · APCA Lc 62
Beste Textfarbe: #000000
WCAG 10.15:1 (AAA) · APCA Lc 62
Contrast pairs
Code-Snippets
CSS
:root {
--whole-grain: #d4ae7e;
--whole-grain-rgb: 212 174 126;
--whole-grain-oklch: oklch(0.773 0.077 72.8);
}
.element {
color: var(--whole-grain);
background-color: hsl(33 50% 66%);
border-color: oklch(0.773 0.077 72.8);
}Tailwind CSS v4
@theme {
--color-whole-grain: #d4ae7e;
--color-whole-grain-50: #fff3dd;
--color-whole-grain-100: #f8e5cc;
--color-whole-grain-200: #e8d0b0;
--color-whole-grain-300: #cfb28c;
--color-whole-grain-400: #bb986b;
--color-whole-grain-500: #a67e4a;
--color-whole-grain-600: #8c6b3f;
--color-whole-grain-700: #705532;
--color-whole-grain-800: #533e23;
--color-whole-grain-900: #3a2a17;
--color-whole-grain-950: #241808;
}SCSS
$whole-grain: #d4ae7e;
$whole-grain-rgb: 212, 174, 126;
$whole-grain-light: mix(#fff, $whole-grain, 20%);
$whole-grain-dark: mix(#000, $whole-grain, 20%);
.element {
color: $whole-grain;
box-shadow: 0 0 0 2px rgba($whole-grain, 0.35);
}