Benannte Farbe · #B4897D
Cappuccino Bombe
Cappuccino Bombe ist #B4897D: rgb(180 137 125), hsl(13 27% 60%), oklch(0.668 0.056 36.1). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Cappuccino Bombe color name →
#B4897D
oklch(0.668 0.056 36.1)
Farbumrechnungen
- HEX
- #b4897d
- RGB
- rgb(180 137 125)
- HSL
- hsl(13 27% 60%)
- HWB
- hwb(13 49% 29%)
- OKLCH
- oklch(0.668 0.056 36.1)
- OKLab
- oklab(0.668 0.045 0.033)
- CIE Lab
- lab(61.07 15.65 13.14)
- LCH
- lch(61.07 20.43 40)
- CMYK
- cmyk(0% 24% 31% 29%)
Tints · Shades · Tones
Tints
- BC9489
- C3A096
- CBABA2
- D2B7AF
- DAC3BC
- E1CFC9
- E9DBD7
- F0E7E4
- F8F3F1
Shades
- 9C766C
- 85645B
- 6E534B
- 58423B
- 44312C
- 30221E
- 1D1411
- 0C0705
- 020101
Tones
- AF887D
- AA877E
- A5877E
- A0867E
- 9A857F
- 95847F
- 90837F
- 8B8280
- 858180
Farbharmonien
Komplementär +180°
- B4897D
Cappuccino Bombe
- 6C9EAB
≈ Tranquili Teal
Analog -30° +30°
- B4897D
Cappuccino Bombe
- B3878F
≈ Rose Tea
- AD8E70
≈ Elegant Earth
Triadisch +120° +240°
- B4897D
Cappuccino Bombe
- 799F86
≈ Aquadulce
- 8B92B7
≈ Fresh Lavender
Geteilt komplementär +150° +210°
- B4897D
Cappuccino Bombe
- 6CA09A
≈ Folk Song
- 7999B5
≈ Bluesy Note
Tetradisch +90° +180° +270°
- B4897D
Cappuccino Bombe
- 8C9B76
≈ Sweet Florence
- 6C9EAB
≈ Tranquili Teal
- 9D8CB0
≈ Saffron Blossom Mauve
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.08:1 · APCA Lc 58
Ag
AAAuf Schwarz
WCAG 6.81:1 · APCA Lc 44
Beste Textfarbe: #000000
WCAG 6.81:1 (AA) · APCA Lc 44
Contrast pairs
Code-Snippets
CSS
:root {
--cappuccino-bombe: #b4897d;
--cappuccino-bombe-rgb: 180 137 125;
--cappuccino-bombe-oklch: oklch(0.668 0.056 36.1);
}
.element {
color: var(--cappuccino-bombe);
background-color: hsl(13 27% 60%);
border-color: oklch(0.668 0.056 36.1);
}Tailwind CSS v4
@theme {
--color-cappuccino-bombe: #b4897d;
--color-cappuccino-bombe-50: #fff0ea;
--color-cappuccino-bombe-100: #fae2db;
--color-cappuccino-bombe-200: #ebcdc3;
--color-cappuccino-bombe-300: #d2aea3;
--color-cappuccino-bombe-400: #bd9388;
--color-cappuccino-bombe-500: #a8796c;
--color-cappuccino-bombe-600: #8e675c;
--color-cappuccino-bombe-700: #725249;
--color-cappuccino-bombe-800: #543c36;
--color-cappuccino-bombe-900: #3b2925;
--color-cappuccino-bombe-950: #251713;
}SCSS
$cappuccino-bombe: #b4897d;
$cappuccino-bombe-rgb: 180, 137, 125;
$cappuccino-bombe-light: mix(#fff, $cappuccino-bombe, 20%);
$cappuccino-bombe-dark: mix(#000, $cappuccino-bombe, 20%);
.element {
color: $cappuccino-bombe;
box-shadow: 0 0 0 2px rgba($cappuccino-bombe, 0.35);
}