Benannte Farbe · #E58281
Sugar Poppy
Sugar Poppy ist #E58281: rgb(229 130 129), hsl(1 66% 70%), oklch(0.714 0.122 21.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Sugar Poppy color name →
#E58281
oklch(0.714 0.122 21.2)
Farbumrechnungen
- HEX
- #e58281
- RGB
- rgb(229 130 129)
- HSL
- hsl(1 66% 70%)
- HWB
- hwb(1 51% 10%)
- OKLCH
- oklch(0.714 0.122 21.2)
- OKLab
- oklab(0.714 0.114 0.044)
- CIE Lab
- lab(65.57 38.83 18.19)
- LCH
- lch(65.57 42.88 25.1)
- CMYK
- cmyk(0% 43% 44% 10%)
Tints · Shades · Tones
Tints
- E98F8D
- ED9B99
- F0A8A6
- F3B4B2
- F6C1BF
- F8CDCB
- FADAD8
- FCE6E5
- FEF3F2
Shades
- C7706F
- AA5F5E
- 8E4E4E
- 723E3E
- 582F2E
- 3F201F
- 281212
- 120606
- 030101
Tones
- DB8281
- D28381
- C88381
- BE8381
- B48381
- AA8281
- A08281
- 958180
- 8B8180
Farbharmonien
Komplementär +180°
- E58281
Sugar Poppy
- 00B9C2
≈ Lago Blue
Analog -30° +30°
- E58281
Sugar Poppy
- DC81AC
≈ Middle Purple
- DF8B58
≈ Hematitic Sand
Triadisch +120° +240°
- E58281
Sugar Poppy
- 76B66C
≈ Bud Green
- 77A2EF
≈ Fennel Flower
Geteilt komplementär +150° +210°
- E58281
Sugar Poppy
- 3ABB99
≈ First Post
- 3FB0E1
≈ Summer Sky
Tetradisch +90° +180° +270°
- E58281
Sugar Poppy
- A6AA47
≈ Delightful Camouflage
- 00B9C2
≈ Lago Blue
- A394E9
≈ Dull Lavender
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.67:1 · APCA Lc 52
Ag
AAAAuf Schwarz
WCAG 7.84:1 · APCA Lc 50
Beste Textfarbe: #000000
WCAG 7.84:1 (AAA) · APCA Lc 50
Contrast pairs
Code-Snippets
CSS
:root {
--sugar-poppy: #e58281;
--sugar-poppy-rgb: 229 130 129;
--sugar-poppy-oklch: oklch(0.714 0.122 21.2);
}
.element {
color: var(--sugar-poppy);
background-color: hsl(1 66% 70%);
border-color: oklch(0.714 0.122 21.2);
}Tailwind CSS v4
@theme {
--color-sugar-poppy: #e58281;
--color-sugar-poppy-50: #ffe8e5;
--color-sugar-poppy-100: #ffd9d5;
--color-sugar-poppy-200: #ffc0bc;
--color-sugar-poppy-300: #f09f9a;
--color-sugar-poppy-400: #dd807f;
--color-sugar-poppy-500: #ca6162;
--color-sugar-poppy-600: #ab5353;
--color-sugar-poppy-700: #894242;
--color-sugar-poppy-800: #662f31;
--color-sugar-poppy-900: #482021;
--color-sugar-poppy-950: #2f0f11;
}SCSS
$sugar-poppy: #e58281;
$sugar-poppy-rgb: 229, 130, 129;
$sugar-poppy-light: mix(#fff, $sugar-poppy, 20%);
$sugar-poppy-dark: mix(#000, $sugar-poppy, 20%);
.element {
color: $sugar-poppy;
box-shadow: 0 0 0 2px rgba($sugar-poppy, 0.35);
}