Nazwany kolor · #EE22AA
Magnificent Magenta
Magnificent Magenta to #EE22AA: rgb(238 34 170), hsl(320 86% 53%), oklch(0.64 0.255 346.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Magnificent Magenta color name →
#EE22AA
oklch(0.64 0.255 346.7)
Konwersje koloru
- HEX
- #ee22aa
- RGB
- rgb(238 34 170)
- HSL
- hsl(320 86% 53%)
- HWB
- hwb(320 13% 7%)
- OKLCH
- oklch(0.64 0.255 346.7)
- OKLab
- oklab(0.64 0.248 -0.059)
- CIE Lab
- lab(54.66 79.32 -20.99)
- LCH
- lch(54.66 82.05 345.2)
- CMYK
- cmyk(0% 86% 29% 7%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F348B2
- F762BB
- FB79C3
- FE8ECC
- FFA1D4
- FFB5DD
- FFC8E5
- FFDAEE
- FFEDF6
Odcienie ciemniejsze
- CF1C93
- B1167D
- 931168
- 770B53
- 5C073F
- 42032D
- 2A011B
- 14000B
- 030001
Tony
- E438A6
- DB47A2
- D1529E
- C75C99
- BC6495
- B16B91
- A6718D
- 9A7689
- 8D7B84
Harmonie kolorów
Komplementarna +180°
- EE22AA
Magnificent Magenta
- 00A57B
≈ Active Green
Analogowa -30° +30°
- EE22AA
Magnificent Magenta
- C643EF
≈ Pink Insanity
- FF1753
≈ Golden Blood
Triada +120° +240°
- EE22AA
Magnificent Magenta
- 979100
≈ Smoothie Green
- 009AC5
≈ Isle of Capri
Komplementarna rozszczepiona +150° +210°
- EE22AA
Magnificent Magenta
- 4BA500
≈ Lawn Green
- 00A0A2
≈ Pleasant Stream
Tetrada +90° +180° +270°
- EE22AA
Magnificent Magenta
- B97F00
≈ Guo Tie Dumpling
- 00A57B
≈ Active Green
- 2C89FF
≈ Pool Water
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.85:1 · APCA Lc 64
Ag
AANa czerni
WCAG 5.44:1 · APCA Lc 38
Najlepszy kolor tekstu: #000000
WCAG 5.44:1 (AA) · APCA Lc 38
Contrast pairs
Fragmenty kodu
CSS
:root {
--magnificent-magenta: #ee22aa;
--magnificent-magenta-rgb: 238 34 170;
--magnificent-magenta-oklch: oklch(0.64 0.255 346.7);
}
.element {
color: var(--magnificent-magenta);
background-color: hsl(320 86% 53%);
border-color: oklch(0.64 0.255 346.7);
}Tailwind CSS v4
@theme {
--color-magnificent-magenta: #ee22aa;
--color-magnificent-magenta-50: #ffd8ff;
--color-magnificent-magenta-100: #ffc5f6;
--color-magnificent-magenta-200: #ffa4e6;
--color-magnificent-magenta-300: #ff78cc;
--color-magnificent-magenta-400: #ff49bc;
--color-magnificent-magenta-500: #ef00a7;
--color-magnificent-magenta-600: #ca008d;
--color-magnificent-magenta-700: #a20071;
--color-magnificent-magenta-800: #780056;
--color-magnificent-magenta-900: #55003c;
--color-magnificent-magenta-950: #390026;
}SCSS
$magnificent-magenta: #ee22aa;
$magnificent-magenta-rgb: 238, 34, 170;
$magnificent-magenta-light: mix(#fff, $magnificent-magenta, 20%);
$magnificent-magenta-dark: mix(#000, $magnificent-magenta, 20%);
.element {
color: $magnificent-magenta;
box-shadow: 0 0 0 2px rgba($magnificent-magenta, 0.35);
}