Benannte Farbe · #CE9FB4
Quilted Heart
Quilted Heart ist #CE9FB4: rgb(206 159 180), hsl(333 32% 72%), oklch(0.752 0.062 350.1). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Quilted Heart color name →
#CE9FB4
oklch(0.752 0.062 350.1)
Farbumrechnungen
- HEX
- #ce9fb4
- RGB
- rgb(206 159 180)
- HSL
- hsl(333 32% 72%)
- HWB
- hwb(333 62% 19%)
- OKLCH
- oklch(0.752 0.062 350.1)
- OKLab
- oklab(0.752 0.061 -0.011)
- CIE Lab
- lab(70.42 20.41 -3.83)
- LCH
- lch(70.42 20.77 349.4)
- CMYK
- cmyk(0% 23% 13% 19%)
Tints · Shades · Tones
Tints
- D3A8BB
- D8B2C3
- DDBBCA
- E2C5D1
- E7CED9
- ECD8E0
- F1E2E8
- F6EBF0
- FAF5F7
Shades
- B38A9C
- 987585
- 7F616E
- 664D58
- 4E3B44
- 382930
- 23181D
- 0F090C
- 020102
Tones
- C69CAF
- BE99A9
- B696A4
- AF939F
- A7909A
- 9F8D94
- 97898F
- 90868A
- 888385
Farbharmonien
Komplementär +180°
- CE9FB4
Quilted Heart
- 87BCA9
≈ Peppermint Bar
Analog -30° +30°
- CE9FB4
Quilted Heart
- C1A2C7
≈ Pale Grape
- D39F9E
≈ Rosewood Apricot
Triadisch +120° +240°
- CE9FB4
Quilted Heart
- B0B385
≈ Winter Pear
- 86B7CF
≈ Blue Bird Morning
Geteilt komplementär +150° +210°
- CE9FB4
Quilted Heart
- 9AB994
≈ Brookview
- 7FBBBE
≈ Warm Waters
Tetradisch +90° +180° +270°
- CE9FB4
Quilted Heart
- C3AB82
≈ Pony
- 87BCA9
≈ Peppermint Bar
- 98B0D7
≈ Blue Skies Today
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.27:1 · APCA Lc 45
Ag
AAAAuf Schwarz
WCAG 9.24:1 · APCA Lc 57
Beste Textfarbe: #000000
WCAG 9.24:1 (AAA) · APCA Lc 57
Contrast pairs
Code-Snippets
CSS
:root {
--quilted-heart: #ce9fb4;
--quilted-heart-rgb: 206 159 180;
--quilted-heart-oklch: oklch(0.752 0.062 350.1);
}
.element {
color: var(--quilted-heart);
background-color: hsl(333 32% 72%);
border-color: oklch(0.752 0.062 350.1);
}Tailwind CSS v4
@theme {
--color-quilted-heart: #ce9fb4;
--color-quilted-heart-50: #ffeef7;
--color-quilted-heart-100: #fae0ea;
--color-quilted-heart-200: #ebcad7;
--color-quilted-heart-300: #d2abbb;
--color-quilted-heart-400: #bc90a3;
--color-quilted-heart-500: #a6758c;
--color-quilted-heart-600: #8d6476;
--color-quilted-heart-700: #714f5f;
--color-quilted-heart-800: #533a46;
--color-quilted-heart-900: #3a2730;
--color-quilted-heart-950: #24161d;
}SCSS
$quilted-heart: #ce9fb4;
$quilted-heart-rgb: 206, 159, 180;
$quilted-heart-light: mix(#fff, $quilted-heart, 20%);
$quilted-heart-dark: mix(#000, $quilted-heart, 20%);
.element {
color: $quilted-heart;
box-shadow: 0 0 0 2px rgba($quilted-heart, 0.35);
}