Benannte Farbe · #AB6F60
Amaretto
Amaretto ist #AB6F60: rgb(171 111 96), hsl(12 31% 52%), oklch(0.602 0.08 34.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Amaretto color name →
#AB6F60
oklch(0.602 0.08 34.7)
Farbumrechnungen
- HEX
- #ab6f60
- RGB
- rgb(171 111 96)
- HSL
- hsl(12 31% 52%)
- HWB
- hwb(12 38% 33%)
- OKLCH
- oklch(0.602 0.08 34.7)
- OKLab
- oklab(0.602 0.066 0.046)
- CIE Lab
- lab(53.13 23.18 18.71)
- LCH
- lch(53.13 29.79 38.9)
- CMYK
- cmyk(0% 35% 44% 33%)
Tints · Shades · Tones
Tints
- B47D6F
- BD8B7E
- C5998E
- CEA79D
- D6B5AD
- DFC4BD
- E7D2CD
- EFE1DE
- F7F0EE
Shades
- 946052
- 7E5145
- 684238
- 54342C
- 402720
- 2D1A15
- 1B0E0A
- 0B0403
- 010100
Tones
- A77163
- A37367
- 9F756A
- 9B776D
- 977870
- 927A74
- 8E7C77
- 8A7D7A
- 857F7D
Farbharmonien
Komplementär +180°
- AB6F60
Amaretto
- 3F8D9E
≈ Winter Time
Analog -30° +30°
- AB6F60
Amaretto
- AA6C7A
≈ Mauvewood
- A2764C
≈ Leather Chair
Triadisch +120° +240°
- AB6F60
Amaretto
- 588F6B
≈ Green Weed
- 727DB1
≈ Magic Moment
Geteilt komplementär +150° +210°
- AB6F60
Amaretto
- 409087
≈ Highlands
- 5686AE
≈ Sand Shark
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 4.05:1 · APCA Lc 68
Ag
AAAuf Schwarz
WCAG 5.17:1 · APCA Lc 34
Beste Textfarbe: #000000
WCAG 5.17:1 (AA) · APCA Lc 34
Contrast pairs
Code-Snippets
CSS
:root {
--amaretto: #ab6f60;
--amaretto-rgb: 171 111 96;
--amaretto-oklch: oklch(0.602 0.08 34.7);
}
.element {
color: var(--amaretto);
background-color: hsl(12 31% 52%);
border-color: oklch(0.602 0.08 34.7);
}Tailwind CSS v4
@theme {
--color-amaretto: #ab6f60;
--color-amaretto-50: #ffeee5;
--color-amaretto-100: #ffdfd5;
--color-amaretto-200: #f4c9bd;
--color-amaretto-300: #ddaa9b;
--color-amaretto-400: #c98e7f;
--color-amaretto-500: #b57262;
--color-amaretto-600: #996153;
--color-amaretto-700: #7b4d42;
--color-amaretto-800: #5b3830;
--color-amaretto-900: #402621;
--color-amaretto-950: #281410;
}SCSS
$amaretto: #ab6f60;
$amaretto-rgb: 171, 111, 96;
$amaretto-light: mix(#fff, $amaretto, 20%);
$amaretto-dark: mix(#000, $amaretto, 20%);
.element {
color: $amaretto;
box-shadow: 0 0 0 2px rgba($amaretto, 0.35);
}