Benannte Farbe · #E6C7B7
Cupcake Rose
Cupcake Rose ist #E6C7B7: rgb(230 199 183), hsl(20 48% 81%), oklch(0.852 0.042 49). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Cupcake Rose color name →
#E6C7B7
oklch(0.852 0.042 49)
Farbumrechnungen
- HEX
- #e6c7b7
- RGB
- rgb(230 199 183)
- HSL
- hsl(20 48% 81%)
- HWB
- hwb(20 72% 10%)
- OKLCH
- oklch(0.852 0.042 49)
- OKLab
- oklab(0.852 0.027 0.031)
- CIE Lab
- lab(82.6 9.48 12.29)
- LCH
- lch(82.6 15.52 52.4)
- CMYK
- cmyk(0% 13% 20% 10%)
Tints · Shades · Tones
Tints
- E9CDBE
- EBD2C5
- EED8CC
- F0DDD3
- F3E3DB
- F5E8E2
- F8EEE9
- FAF4F0
- FDF9F8
Shades
- C8AD9F
- AB9387
- 8E7A70
- 73625A
- 594C45
- 403631
- 28211E
- 130E0C
- 030202
Tones
- DBC0B1
- D1B8AC
- C6B1A6
- BCAAA1
- B2A39B
- A89C96
- 9E9590
- 948E8B
- 8A8785
Farbharmonien
Komplementär +180°
- E6C7B7
Cupcake Rose
- B3D4E4
≈ Spotted Snake Eel
Analog -30° +30°
- E6C7B7
Cupcake Rose
- E9C4C4
≈ Pelican Feather
- DDCCB0
≈ Unforgettable
Triadisch +120° +240°
- E6C7B7
Cupcake Rose
- B5D8CA
≈ Gemini
- CDCAE9
≈ Italian Fitch
Geteilt komplementär +150° +210°
- E6C7B7
Cupcake Rose
- B0D7D8
≈ Timeless
- BED0EA
≈ Maritime
Tetradisch +90° +180° +270°
- E6C7B7
Cupcake Rose
- C1D5BB
≈ Surf Crest
- B3D4E4
≈ Spotted Snake Eel
- DAC6E0
≈ Simply Lavender
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.58:1 · APCA Lc 27
Ag
AAAAuf Schwarz
WCAG 13.21:1 · APCA Lc 76
Beste Textfarbe: #000000
WCAG 13.21:1 (AAA) · APCA Lc 76
Contrast pairs
Code-Snippets
CSS
:root {
--cupcake-rose: #e6c7b7;
--cupcake-rose-rgb: 230 199 183;
--cupcake-rose-oklch: oklch(0.852 0.042 49);
}
.element {
color: var(--cupcake-rose);
background-color: hsl(20 48% 81%);
border-color: oklch(0.852 0.042 49);
}Tailwind CSS v4
@theme {
--color-cupcake-rose: #e6c7b7;
--color-cupcake-rose-50: #fff2eb;
--color-cupcake-rose-100: #f4e4dc;
--color-cupcake-rose-200: #e4d0c5;
--color-cupcake-rose-300: #cab2a5;
--color-cupcake-rose-400: #b49889;
--color-cupcake-rose-500: #9e7e6e;
--color-cupcake-rose-600: #856b5d;
--color-cupcake-rose-700: #6b564b;
--color-cupcake-rose-800: #4f3e36;
--color-cupcake-rose-900: #372b25;
--color-cupcake-rose-950: #221814;
}SCSS
$cupcake-rose: #e6c7b7;
$cupcake-rose-rgb: 230, 199, 183;
$cupcake-rose-light: mix(#fff, $cupcake-rose, 20%);
$cupcake-rose-dark: mix(#000, $cupcake-rose, 20%);
.element {
color: $cupcake-rose;
box-shadow: 0 0 0 2px rgba($cupcake-rose, 0.35);
}