Benannte Farbe · #EEC3EE
Purple’s Baby Sister
Purple’s Baby Sister ist #EEC3EE: rgb(238 195 238), hsl(300 56% 85%), oklch(0.868 0.075 326.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Purple’s Baby Sister color name →
#EEC3EE
oklch(0.868 0.075 326.2)
Farbumrechnungen
- HEX
- #eec3ee
- RGB
- rgb(238 195 238)
- HSL
- hsl(300 56% 85%)
- HWB
- hwb(300 76% 7%)
- OKLCH
- oklch(0.868 0.075 326.2)
- OKLab
- oklab(0.868 0.062 -0.041)
- CIE Lab
- lab(83.61 21.13 -15.34)
- LCH
- lch(83.61 26.11 324)
- CMYK
- cmyk(0% 18% 0% 7%)
Tints · Shades · Tones
Tints
- F0C9F0
- F2CFF2
- F4D5F3
- F5DBF5
- F7E1F7
- F9E7F8
- FAEDFA
- FCF3FC
- FDF9FD
Shades
- CFA9CF
- B190B1
- 937893
- 776077
- 5C4A5C
- 423442
- 2A202A
- 140E14
- 030203
Tones
- E3BCE3
- D7B5D7
- CCAFCC
- C1A8C1
- B6A1B6
- AB9AAB
- A094A0
- 958D95
- 8B878A
Farbharmonien
Komplementär +180°
- EEC3EE
Purple’s Baby Sister
- B4E1B7
≈ Fringy Flower
Analog -30° +30°
- EEC3EE
Purple’s Baby Sister
- D7CAFF
≈ Innocent Snowdrop
- FDC0D5
≈ Garden Glory
Triadisch +120° +240°
- EEC3EE
Purple’s Baby Sister
- E9D19B
≈ Italian Straw
- 98E2EC
≈ Blizzard Blue
Geteilt komplementär +150° +210°
- EEC3EE
Purple’s Baby Sister
- D0DAA2
≈ Lettuce Alone
- 9EE4D2
≈ Aqua Wish
Tetradisch +90° +180° +270°
- EEC3EE
Purple’s Baby Sister
- FAC8A4
≈ Fresco Cream
- B4E1B7
≈ Fringy Flower
- A4DCFE
≈ Droplet
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.53:1 · APCA Lc 25
Ag
AAAAuf Schwarz
WCAG 13.67:1 · APCA Lc 78
Beste Textfarbe: #000000
WCAG 13.67:1 (AAA) · APCA Lc 78
Contrast pairs
Code-Snippets
CSS
:root {
--purple-s-baby-sister: #eec3ee;
--purple-s-baby-sister-rgb: 238 195 238;
--purple-s-baby-sister-oklch: oklch(0.868 0.075 326.2);
}
.element {
color: var(--purple-s-baby-sister);
background-color: hsl(300 56% 85%);
border-color: oklch(0.868 0.075 326.2);
}Tailwind CSS v4
@theme {
--color-purple-s-baby-sister: #eec3ee;
--color-purple-s-baby-sister-50: #ffeeff;
--color-purple-s-baby-sister-100: #f6e0f5;
--color-purple-s-baby-sister-200: #e7cae5;
--color-purple-s-baby-sister-300: #cdaacb;
--color-purple-s-baby-sister-400: #b68fb6;
--color-purple-s-baby-sister-500: #a075a1;
--color-purple-s-baby-sister-600: #876388;
--color-purple-s-baby-sister-700: #6d4f6d;
--color-purple-s-baby-sister-800: #4f3951;
--color-purple-s-baby-sister-900: #372738;
--color-purple-s-baby-sister-950: #221523;
}SCSS
$purple-s-baby-sister: #eec3ee;
$purple-s-baby-sister-rgb: 238, 195, 238;
$purple-s-baby-sister-light: mix(#fff, $purple-s-baby-sister, 20%);
$purple-s-baby-sister-dark: mix(#000, $purple-s-baby-sister, 20%);
.element {
color: $purple-s-baby-sister;
box-shadow: 0 0 0 2px rgba($purple-s-baby-sister, 0.35);
}