Nächste benannte Farbe · #CE58E9
#CE58E9
Nächste benannte Farbe: Bubblegum Baby Girl
#CE58E9 (rgb(206 88 233), hsl(289 77% 63%), oklch(0.667 0.228 319.7)) liegt am nächsten an der benannten Farbe Bubblegum Baby Girl. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#CE58E9
oklch(0.667 0.228 319.7)
Farbumrechnungen
- HEX
- #ce58e9
- RGB
- rgb(206 88 233)
- HSL
- hsl(289 77% 63%)
- HWB
- hwb(289 35% 9%)
- OKLCH
- oklch(0.667 0.228 319.7)
- OKLab
- oklab(0.667 0.174 -0.147)
- CIE Lab
- lab(57.72 62.24 -52.74)
- LCH
- lch(57.72 81.58 319.7)
- CMYK
- cmyk(12% 62% 0% 9%)
Tints · Shades · Tones
Tints
- D46CEC
- DA7EEF
- DF8FF2
- E4A0F5
- E9B0F7
- EEC0F9
- F3D0FB
- F7E0FD
- FBEFFE
Shades
- B34BCB
- 983FAD
- 7F3390
- 662874
- 4E1D5A
- 381241
- 230929
- 0F0313
- 020003
Tones
- C75FDF
- BF65D4
- B86ACA
- B06FC0
- A873B5
- A076AB
- 9979A0
- 917C96
- 887E8B
Farbharmonien
Komplementär +180°
- CE58E9
Bubblegum Baby Girl
- 39B100
≈ Pikkoro Green
Analog -30° +30°
- CE58E9
Bubblegum Baby Girl
- 957AFF
≈ Forgotten Purple
- F244A8
≈ Major Magenta
Triadisch +120° +240°
- CE58E9
Bubblegum Baby Girl
- C08900
≈ Kenyan Sand
- 00A9AF
≈ Blue Bolero
Geteilt komplementär +150° +210°
- CE58E9
Bubblegum Baby Girl
- 9B9B00
≈ Papyrus
- 00AE87
≈ Herbal
Tetradisch +90° +180° +270°
- CE58E9
Bubblegum Baby Girl
- E66C00
≈ Accent Orange
- 39B100
≈ Pikkoro Green
- 00A2D5
≈ Blue Damselfly
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.38:1 · APCA Lc 61
Ag
AAAuf Schwarz
WCAG 6.19:1 · APCA Lc 41
Beste Textfarbe: #000000
WCAG 6.19:1 (AA) · APCA Lc 41
Contrast pairs
Code-Snippets
CSS
:root {
--bubblegum-baby-girl: #ce58e9;
--bubblegum-baby-girl-rgb: 206 88 233;
--bubblegum-baby-girl-oklch: oklch(0.667 0.228 319.7);
}
.element {
color: var(--bubblegum-baby-girl);
background-color: hsl(289 77% 63%);
border-color: oklch(0.667 0.228 319.7);
}Tailwind CSS v4
@theme {
--color-bubblegum-baby-girl: #ce58e9;
--color-bubblegum-baby-girl-50: #ffe0ff;
--color-bubblegum-baby-girl-100: #ffcfff;
--color-bubblegum-baby-girl-200: #ffb3ff;
--color-bubblegum-baby-girl-300: #ec8cfc;
--color-bubblegum-baby-girl-400: #d768f0;
--color-bubblegum-baby-girl-500: #c33be1;
--color-bubblegum-baby-girl-600: #a535be;
--color-bubblegum-baby-girl-700: #852a99;
--color-bubblegum-baby-girl-800: #611e74;
--color-bubblegum-baby-girl-900: #441452;
--color-bubblegum-baby-girl-950: #2c0437;
}SCSS
$bubblegum-baby-girl: #ce58e9;
$bubblegum-baby-girl-rgb: 206, 88, 233;
$bubblegum-baby-girl-light: mix(#fff, $bubblegum-baby-girl, 20%);
$bubblegum-baby-girl-dark: mix(#000, $bubblegum-baby-girl, 20%);
.element {
color: $bubblegum-baby-girl;
box-shadow: 0 0 0 2px rgba($bubblegum-baby-girl, 0.35);
}