Nächste benannte Farbe · #CE627C
#CE627C
Nächste benannte Farbe: Peppermint Swirl
#CE627C (rgb(206 98 124), hsl(346 52% 60%), oklch(0.633 0.139 6.7)) liegt am nächsten an der benannten Farbe Peppermint Swirl. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#CE627C
oklch(0.633 0.139 6.7)
Farbumrechnungen
- HEX
- #ce627c
- RGB
- rgb(206 98 124)
- HSL
- hsl(346 52% 60%)
- HWB
- hwb(346 38% 19%)
- OKLCH
- oklch(0.633 0.139 6.7)
- OKLab
- oklab(0.633 0.138 0.016)
- CIE Lab
- lab(55.8 45.49 6.98)
- LCH
- lch(55.8 46.03 8.7)
- CMYK
- cmyk(0% 52% 40% 19%)
Tints · Shades · Tones
Tints
- D57288
- DB8295
- E192A2
- E6A1AE
- EBB1BB
- F0C0C9
- F4D0D6
- F8E0E4
- FCEFF1
Shades
- B3546B
- 98475A
- 7F3A4A
- 662D3B
- 4E212C
- 38161E
- 230B11
- 0F0305
- 020001
Tones
- C7667C
- C06A7D
- B96D7D
- B1717E
- AA747E
- A2777E
- 9A797F
- 927C7F
- 897E80
Farbharmonien
Komplementär +180°
- CE627C
Peppermint Swirl
- 009F95
≈ Spectra Green
Analog -30° +30°
- CE627C
Peppermint Swirl
- BE66A9
≈ Young Purple
- CF684A
≈ Citrus Notes
Triadisch +120° +240°
- CE627C
Peppermint Swirl
- 74992F
≈ Hidden Valley
- 3590D9
≈ Magical Merlin
Geteilt komplementär +150° +210°
- CE627C
Peppermint Swirl
- 27A267
≈ Biel-Tan Green
- 009AB6
≈ Barrier Reef
Tetradisch +90° +180° +270°
- CE627C
Peppermint Swirl
- A18900
≈ Golden Palm
- 009F95
≈ Spectra Green
- 7580DD
≈ Tanzine
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.70:1 · APCA Lc 64
Ag
AAAuf Schwarz
WCAG 5.66:1 · APCA Lc 37
Beste Textfarbe: #000000
WCAG 5.66:1 (AA) · APCA Lc 37
Contrast pairs
Code-Snippets
CSS
:root {
--peppermint-swirl: #ce627c;
--peppermint-swirl-rgb: 206 98 124;
--peppermint-swirl-oklch: oklch(0.633 0.139 6.7);
}
.element {
color: var(--peppermint-swirl);
background-color: hsl(346 52% 60%);
border-color: oklch(0.633 0.139 6.7);
}Tailwind CSS v4
@theme {
--color-peppermint-swirl: #ce627c;
--color-peppermint-swirl-50: #ffe6ed;
--color-peppermint-swirl-100: #ffd5de;
--color-peppermint-swirl-200: #ffbcc8;
--color-peppermint-swirl-300: #f499a9;
--color-peppermint-swirl-400: #e27991;
--color-peppermint-swirl-500: #cf5877;
--color-peppermint-swirl-600: #af4c65;
--color-peppermint-swirl-700: #8d3c50;
--color-peppermint-swirl-800: #682b3c;
--color-peppermint-swirl-900: #491d29;
--color-peppermint-swirl-950: #300c17;
}SCSS
$peppermint-swirl: #ce627c;
$peppermint-swirl-rgb: 206, 98, 124;
$peppermint-swirl-light: mix(#fff, $peppermint-swirl, 20%);
$peppermint-swirl-dark: mix(#000, $peppermint-swirl, 20%);
.element {
color: $peppermint-swirl;
box-shadow: 0 0 0 2px rgba($peppermint-swirl, 0.35);
}