Benannte Farbe · #B49D7B
Sugared Almond
Sugared Almond ist #B49D7B: rgb(180 157 123), hsl(36 28% 59%), oklch(0.708 0.054 77.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Sugared Almond color name →
#B49D7B
oklch(0.708 0.054 77.4)
Farbumrechnungen
- HEX
- #b49d7b
- RGB
- rgb(180 157 123)
- HSL
- hsl(36 28% 59%)
- HWB
- hwb(36 48% 29%)
- OKLCH
- oklch(0.708 0.054 77.4)
- OKLab
- oklab(0.708 0.012 0.053)
- CIE Lab
- lab(66.16 4.98 21.13)
- LCH
- lch(66.16 21.71 76.8)
- CMYK
- cmyk(0% 13% 32% 29%)
Tints · Shades · Tones
Tints
- BBA688
- C3B095
- CABAA2
- D2C3AF
- D9CDBC
- E1D7C9
- E8E1D6
- F0EBE4
- F7F5F1
Shades
- 9C886A
- 85735A
- 6E5F4A
- 584C3A
- 443A2C
- 30281E
- 1D1810
- 0C0905
- 020101
Tones
- AF9A7C
- A9977C
- A4947D
- 9F917E
- 9A8F7E
- 958C7F
- 8F897F
- 8A867F
- 858380
Farbharmonien
Komplementär +180°
- B49D7B
Sugared Almond
- 8CA2C3
≈ Windy City
Analog -30° +30°
- B49D7B
Sugared Almond
- BE9784
≈ Spiced Brandy
- A4A47D
≈ Locust
Triadisch +120° +240°
- B49D7B
Sugared Almond
- 78ACAD
≈ Solution
- AF97B7
≈ Purple Springs
Geteilt komplementär +150° +210°
- B49D7B
Sugared Almond
- 7DA8BB
≈ Winter Twilight
- 9E9CC2
≈ Majestic Violet
Tetradisch +90° +180° +270°
- B49D7B
Sugared Almond
- 80AC9A
≈ Catnip
- 8CA2C3
≈ Windy City
- BB94A7
≈ Violet Fantasy
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.60:1 · APCA Lc 51
Ag
AAAAuf Schwarz
WCAG 8.04:1 · APCA Lc 51
Beste Textfarbe: #000000
WCAG 8.04:1 (AAA) · APCA Lc 51
Contrast pairs
Code-Snippets
CSS
:root {
--sugared-almond: #b49d7b;
--sugared-almond-rgb: 180 157 123;
--sugared-almond-oklch: oklch(0.708 0.054 77.4);
}
.element {
color: var(--sugared-almond);
background-color: hsl(36 28% 59%);
border-color: oklch(0.708 0.054 77.4);
}Tailwind CSS v4
@theme {
--color-sugared-almond: #b49d7b;
--color-sugared-almond-50: #fef4e4;
--color-sugared-almond-100: #f2e6d4;
--color-sugared-almond-200: #e1d2bb;
--color-sugared-almond-300: #c6b599;
--color-sugared-almond-400: #b19b7b;
--color-sugared-almond-500: #9a825d;
--color-sugared-almond-600: #836e4f;
--color-sugared-almond-700: #69583f;
--color-sugared-almond-800: #4d402d;
--color-sugared-almond-900: #362c1e;
--color-sugared-almond-950: #21190e;
}SCSS
$sugared-almond: #b49d7b;
$sugared-almond-rgb: 180, 157, 123;
$sugared-almond-light: mix(#fff, $sugared-almond, 20%);
$sugared-almond-dark: mix(#000, $sugared-almond, 20%);
.element {
color: $sugared-almond;
box-shadow: 0 0 0 2px rgba($sugared-almond, 0.35);
}