Benannte Farbe · #FEA5A2
Pink Dream
Pink Dream ist #FEA5A2: rgb(254 165 162), hsl(2 98% 82%), oklch(0.809 0.106 21.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Pink mean? → · Pink Dream color name →
#FEA5A2
oklch(0.809 0.106 21.8)
Farbumrechnungen
- HEX
- #fea5a2
- RGB
- rgb(254 165 162)
- HSL
- hsl(2 98% 82%)
- HWB
- hwb(2 64% 0%)
- OKLCH
- oklch(0.809 0.106 21.8)
- OKLab
- oklab(0.809 0.099 0.039)
- CIE Lab
- lab(76.81 33.54 15.96)
- LCH
- lch(76.81 37.14 25.4)
- CMYK
- cmyk(0% 35% 36% 0%)
Tints · Shades · Tones
Tints
- FFAEAB
- FFB7B4
- FFC0BD
- FFC9C7
- FFD2D0
- FFDBD9
- FFE4E3
- FFEDEC
- FFF6F5
Shades
- DD8F8C
- BD7977
- 9E6563
- 80514F
- 633D3C
- 472B2A
- 2D1A19
- 160A0A
- 030101
Tones
- F1A29F
- E59E9B
- D89B98
- CB9794
- BF9391
- B2908E
- A68C8A
- 998887
- 8D8483
Farbharmonien
Komplementär +180°
- FEA5A2
Pink Dream
- 5FD5DE
≈ Neon Nazar
Analog -30° +30°
- FEA5A2
Pink Dream
- F6A4C8
≈ Rogue Pink
- F8AD80
≈ Orange Chiffon
Triadisch +120° +240°
- FEA5A2
Pink Dream
- 99D292
≈ Botanist
- 9FC1FF
≈ Pastel Blue
Geteilt komplementär +150° +210°
- FEA5A2
Pink Dream
- 71D7B9
≈ Peppy
- 74CDF9
≈ Bubbly Barracuda
Tetradisch +90° +180° +270°
- FEA5A2
Pink Dream
- C2C875
≈ Siskin Green
- 5FD5DE
≈ Neon Nazar
- C1B5FF
≈ Greyish Lavender
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.88:1 · APCA Lc 36
Ag
AAAAuf Schwarz
WCAG 11.11:1 · APCA Lc 67
Beste Textfarbe: #000000
WCAG 11.11:1 (AAA) · APCA Lc 67
Contrast pairs
Code-Snippets
CSS
:root {
--pink-dream: #fea5a2;
--pink-dream-rgb: 254 165 162;
--pink-dream-oklch: oklch(0.809 0.106 21.8);
}
.element {
color: var(--pink-dream);
background-color: hsl(2 98% 82%);
border-color: oklch(0.809 0.106 21.8);
}Tailwind CSS v4
@theme {
--color-pink-dream: #fea5a2;
--color-pink-dream-50: #ffeae7;
--color-pink-dream-100: #ffdbd7;
--color-pink-dream-200: #ffc3bf;
--color-pink-dream-300: #e9a29d;
--color-pink-dream-400: #d68582;
--color-pink-dream-500: #c36766;
--color-pink-dream-600: #a45857;
--color-pink-dream-700: #844645;
--color-pink-dream-800: #623233;
--color-pink-dream-900: #452223;
--color-pink-dream-950: #2c1112;
}SCSS
$pink-dream: #fea5a2;
$pink-dream-rgb: 254, 165, 162;
$pink-dream-light: mix(#fff, $pink-dream, 20%);
$pink-dream-dark: mix(#000, $pink-dream, 20%);
.element {
color: $pink-dream;
box-shadow: 0 0 0 2px rgba($pink-dream, 0.35);
}