Benannte Farbe · #C9AF96
Toasted Wheat
Toasted Wheat ist #C9AF96: rgb(201 175 150), hsl(29 32% 69%), oklch(0.77 0.046 65.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Toasted Wheat color name →
#C9AF96
oklch(0.77 0.046 65.9)
Farbumrechnungen
- HEX
- #c9af96
- RGB
- rgb(201 175 150)
- HSL
- hsl(29 32% 69%)
- HWB
- hwb(29 59% 21%)
- OKLCH
- oklch(0.77 0.046 65.9)
- OKLab
- oklab(0.77 0.019 0.042)
- CIE Lab
- lab(73.27 6.87 16.51)
- LCH
- lch(73.27 17.88 67.4)
- CMYK
- cmyk(0% 13% 25% 21%)
Tints · Shades · Tones
Tints
- CEB7A0
- D4BFAB
- D9C7B5
- DFCFBF
- E4D6CA
- E9DFD4
- EFE7DF
- F4EFE9
- FAF7F4
Shades
- AE9882
- 95816E
- 7C6B5B
- 645649
- 4C4137
- 362E26
- 221C16
- 0F0B08
- 020101
Tones
- C2AA94
- BAA592
- B3A190
- AB9C8D
- A4978B
- 9D9389
- 958E87
- 8E8985
- 878582
Farbharmonien
Komplementär +180°
- C9AF96
Toasted Wheat
- 9DB8D0
≈ Novella Blue
Analog -30° +30°
- C9AF96
Toasted Wheat
- CFABA0
≈ Art Deco Pink
- BDB594
≈ Easy
Triadisch +120° +240°
- C9AF96
Toasted Wheat
- 94BEB8
≈ Envisage
- BBADCC
≈ Jacey’s Favourite
Geteilt komplementär +150° +210°
- C9AF96
Toasted Wheat
- 94BCC7
≈ Squirt
- ACB2D2
≈ Pixie Violet
Tetradisch +90° +180° +270°
- C9AF96
Toasted Wheat
- 9EBDA8
≈ Reeds
- 9DB8D0
≈ Novella Blue
- C8AABF
≈ Fragrant Lilac
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.08:1 · APCA Lc 41
Ag
AAAAuf Schwarz
WCAG 10.05:1 · APCA Lc 61
Beste Textfarbe: #000000
WCAG 10.05:1 (AAA) · APCA Lc 61
Contrast pairs
Code-Snippets
CSS
:root {
--toasted-wheat: #c9af96;
--toasted-wheat-rgb: 201 175 150;
--toasted-wheat-oklch: oklch(0.77 0.046 65.9);
}
.element {
color: var(--toasted-wheat);
background-color: hsl(29 32% 69%);
border-color: oklch(0.77 0.046 65.9);
}Tailwind CSS v4
@theme {
--color-toasted-wheat: #c9af96;
--color-toasted-wheat-50: #fef3e8;
--color-toasted-wheat-100: #f3e5d8;
--color-toasted-wheat-200: #e2d1c0;
--color-toasted-wheat-300: #c8b49f;
--color-toasted-wheat-400: #b29a82;
--color-toasted-wheat-500: #9c8166;
--color-toasted-wheat-600: #836d57;
--color-toasted-wheat-700: #695745;
--color-toasted-wheat-800: #4e3f32;
--color-toasted-wheat-900: #362c22;
--color-toasted-wheat-950: #211911;
}SCSS
$toasted-wheat: #c9af96;
$toasted-wheat-rgb: 201, 175, 150;
$toasted-wheat-light: mix(#fff, $toasted-wheat, 20%);
$toasted-wheat-dark: mix(#000, $toasted-wheat, 20%);
.element {
color: $toasted-wheat;
box-shadow: 0 0 0 2px rgba($toasted-wheat, 0.35);
}