Najbliższy nazwany kolor · #EF4C68
#EF4C68
Najbliższy nazwany kolor: Munch on Melon
#EF4C68 (rgb(239 76 104), hsl(350 84% 62%), oklch(0.651 0.198 14.7)) jest najbliższy nazwanemu kolorowi Munch on Melon. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#EF4C68
oklch(0.651 0.198 14.7)
Konwersje koloru
- HEX
- #ef4c68
- RGB
- rgb(239 76 104)
- HSL
- hsl(350 84% 62%)
- HWB
- hwb(350 30% 6%)
- OKLCH
- oklch(0.651 0.198 14.7)
- OKLab
- oklab(0.651 0.192 0.05)
- CIE Lab
- lab(57.29 64.3 21.81)
- LCH
- lch(57.29 67.9 18.7)
- CMYK
- cmyk(0% 68% 56% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F36276
- F77685
- FB8894
- FD9AA2
- FFABB1
- FFBCC1
- FFCDD0
- FFDEDF
- FFEEEF
Odcienie ciemniejsze
- D04159
- B1364B
- 942C3E
- 782230
- 5C1824
- 420F18
- 2A060C
- 140204
- 030000
Tony
- E5556B
- DB5D6D
- D16370
- C66972
- BC6E75
- B17277
- A57679
- 9A7A7C
- 8D7D7E
Harmonie kolorów
Komplementarna +180°
- EF4C68
Munch on Melon
- 00A4A4
≈ Wax Crayon Blue
Analogowa -30° +30°
- EF4C68
Munch on Melon
- DE51AB
≈ Orion
- E75F00
≈ Spanish Orange
Triada +120° +240°
- EF4C68
Munch on Melon
- 58A700
≈ Ruminant’s Paradise
- 298FFF
≈ Clear Chill
Komplementarna rozszczepiona +150° +210°
- EF4C68
Munch on Melon
- 00A97A
≈ Dragon Scale
- 009EC7
≈ Blue Ocean
Tetrada +90° +180° +270°
- EF4C68
Munch on Melon
- 9D9300
≈ Romaine Green
- 00A4A4
≈ Wax Crayon Blue
- 8777FF
≈ Bainganī
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.55:1 · APCA Lc 62
Ag
AANa czerni
WCAG 5.90:1 · APCA Lc 40
Najlepszy kolor tekstu: #000000
WCAG 5.90:1 (AA) · APCA Lc 40
Contrast pairs
Fragmenty kodu
CSS
:root {
--munch-on-melon: #ef4c68;
--munch-on-melon-rgb: 239 76 104;
--munch-on-melon-oklch: oklch(0.651 0.198 14.7);
}
.element {
color: var(--munch-on-melon);
background-color: hsl(350 84% 62%);
border-color: oklch(0.651 0.198 14.7);
}Tailwind CSS v4
@theme {
--color-munch-on-melon: #ef4c68;
--color-munch-on-melon-50: #ffdfe1;
--color-munch-on-melon-100: #ffcdd0;
--color-munch-on-melon-200: #ffb0b6;
--color-munch-on-melon-300: #ff8993;
--color-munch-on-melon-400: #fd6279;
--color-munch-on-melon-500: #eb325b;
--color-munch-on-melon-600: #c72d4d;
--color-munch-on-melon-700: #a0243e;
--color-munch-on-melon-800: #77182f;
--color-munch-on-melon-900: #54101f;
--color-munch-on-melon-950: #38020f;
}SCSS
$munch-on-melon: #ef4c68;
$munch-on-melon-rgb: 239, 76, 104;
$munch-on-melon-light: mix(#fff, $munch-on-melon, 20%);
$munch-on-melon-dark: mix(#000, $munch-on-melon, 20%);
.element {
color: $munch-on-melon;
box-shadow: 0 0 0 2px rgba($munch-on-melon, 0.35);
}