Benannte Farbe · #D38798
Speckled Easter Egg
Speckled Easter Egg ist #D38798: rgb(211 135 152), hsl(347 46% 68%), oklch(0.706 0.095 5.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Speckled Easter Egg color name →
#D38798
oklch(0.706 0.095 5.2)
Farbumrechnungen
- HEX
- #d38798
- RGB
- rgb(211 135 152)
- HSL
- hsl(347 46% 68%)
- HWB
- hwb(347 53% 17%)
- OKLCH
- oklch(0.706 0.095 5.2)
- OKLab
- oklab(0.706 0.095 0.009)
- CIE Lab
- lab(64.78 31.53 3.73)
- LCH
- lch(64.78 31.75 6.7)
- CMYK
- cmyk(0% 36% 28% 17%)
Tints · Shades · Tones
Tints
- D893A2
- DD9FAC
- E2ABB6
- E7B7C0
- EBC2CA
- F0CED5
- F4DBDF
- F8E7EA
- FBF3F4
Shades
- B77584
- 9C6370
- 82515C
- 69414A
- 513138
- 3A2127
- 241317
- 100608
- 020101
Tones
- CB8796
- C38693
- BB8691
- B3858E
- AA848C
- A2848A
- 9A8387
- 918285
- 898182
Farbharmonien
Komplementär +180°
- D38798
Speckled Easter Egg
- 4FB4A8
≈ Emerald Wave
Analog -30° +30°
- D38798
Speckled Easter Egg
- C68AB8
≈ Rock Star Pink
- D48B78
≈ Zanci
Triadisch +120° +240°
- D38798
Speckled Easter Egg
- 92AB68
≈ Celuce
- 6CA7D8
≈ Baja Blue
Geteilt komplementär +150° +210°
- D38798
Speckled Easter Egg
- 6DB287
≈ Lily Pads
- 4FAFC6
≈ Viking
Tetradisch +90° +180° +270°
- D38798
Speckled Easter Egg
- B3A058
≈ Gingko Leaf
- 4FB4A8
≈ Emerald Wave
- 8F9CDC
≈ Portage
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.73:1 · APCA Lc 53
Ag
AAAAuf Schwarz
WCAG 7.68:1 · APCA Lc 49
Beste Textfarbe: #000000
WCAG 7.68:1 (AAA) · APCA Lc 49
Contrast pairs
Code-Snippets
CSS
:root {
--speckled-easter-egg: #d38798;
--speckled-easter-egg-rgb: 211 135 152;
--speckled-easter-egg-oklch: oklch(0.706 0.095 5.2);
}
.element {
color: var(--speckled-easter-egg);
background-color: hsl(347 46% 68%);
border-color: oklch(0.706 0.095 5.2);
}Tailwind CSS v4
@theme {
--color-speckled-easter-egg: #d38798;
--color-speckled-easter-egg-50: #ffebf0;
--color-speckled-easter-egg-100: #ffdbe2;
--color-speckled-easter-egg-200: #f9c4cd;
--color-speckled-easter-egg-300: #e3a3af;
--color-speckled-easter-egg-400: #cf8797;
--color-speckled-easter-egg-500: #bb6a7d;
--color-speckled-easter-egg-600: #9e5a6a;
--color-speckled-easter-egg-700: #7f4855;
--color-speckled-easter-egg-800: #5e343f;
--color-speckled-easter-egg-900: #42232b;
--color-speckled-easter-egg-950: #2a1219;
}SCSS
$speckled-easter-egg: #d38798;
$speckled-easter-egg-rgb: 211, 135, 152;
$speckled-easter-egg-light: mix(#fff, $speckled-easter-egg, 20%);
$speckled-easter-egg-dark: mix(#000, $speckled-easter-egg, 20%);
.element {
color: $speckled-easter-egg;
box-shadow: 0 0 0 2px rgba($speckled-easter-egg, 0.35);
}