Nazwany kolor · #AF73B0
Moonlight Melody
Moonlight Melody to #AF73B0: rgb(175 115 176), hsl(299 28% 57%), oklch(0.639 0.112 326.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Moonlight Melody color name →
#AF73B0
oklch(0.639 0.112 326.2)
Konwersje koloru
- HEX
- #af73b0
- RGB
- rgb(175 115 176)
- HSL
- hsl(299 28% 57%)
- HWB
- hwb(299 45% 31%)
- OKLCH
- oklch(0.639 0.112 326.2)
- OKLab
- oklab(0.639 0.093 -0.062)
- CIE Lab
- lab(56.55 31.69 -22.67)
- LCH
- lch(56.55 38.96 324.4)
- CMYK
- cmyk(1% 35% 0% 31%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B781B8
- C08EC0
- C89CC8
- D0AAD0
- D8B8D8
- E0C6DF
- E8D4E7
- EFE2EF
- F7F1F7
Odcienie ciemniejsze
- 986399
- 815482
- 6B456C
- 563656
- 412842
- 2E1B2E
- 1C0F1C
- 0B050B
- 010101
Tony
- AB75AB
- A676A7
- A178A2
- 9D799D
- 987B98
- 947C93
- 8F7D8F
- 8A7E8A
- 857F85
Harmonie kolorów
Komplementarna +180°
- AF73B0
Moonlight Melody
- 5C9E62
≈ Mosaic Green
Analogowa -30° +30°
- AF73B0
Moonlight Melody
- 927DC8
≈ Faraway Sky
- C16E8E
≈ Silk Ribbon
Triada +120° +240°
- AF73B0
Moonlight Melody
- AA872F
≈ Rich Gold
- 009EAD
≈ Lake Blue
Komplementarna rozszczepiona +150° +210°
- AF73B0
Moonlight Melody
- 88943E
≈ Wasabi Nuts
- 22A28A
≈ Stamp Pad Green
Tetrada +90° +180° +270°
- AF73B0
Moonlight Melody
- BF7944
≈ Sedona at Sunset
- 5C9E62
≈ Mosaic Green
- 3C96C7
≈ Stratos Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.55:1 · APCA Lc 63
Ag
AANa czerni
WCAG 5.90:1 · APCA Lc 39
Najlepszy kolor tekstu: #000000
WCAG 5.90:1 (AA) · APCA Lc 39
Contrast pairs
Fragmenty kodu
CSS
:root {
--moonlight-melody: #af73b0;
--moonlight-melody-rgb: 175 115 176;
--moonlight-melody-oklch: oklch(0.639 0.112 326.2);
}
.element {
color: var(--moonlight-melody);
background-color: hsl(299 28% 57%);
border-color: oklch(0.639 0.112 326.2);
}Tailwind CSS v4
@theme {
--color-moonlight-melody: #af73b0;
--color-moonlight-melody-50: #ffeaff;
--color-moonlight-melody-100: #fddbfb;
--color-moonlight-melody-200: #efc4ed;
--color-moonlight-melody-300: #d7a3d4;
--color-moonlight-melody-400: #c187c2;
--color-moonlight-melody-500: #ac6aad;
--color-moonlight-melody-600: #915a92;
--color-moonlight-melody-700: #754875;
--color-moonlight-melody-800: #553458;
--color-moonlight-melody-900: #3c243d;
--color-moonlight-melody-950: #251227;
}SCSS
$moonlight-melody: #af73b0;
$moonlight-melody-rgb: 175, 115, 176;
$moonlight-melody-light: mix(#fff, $moonlight-melody, 20%);
$moonlight-melody-dark: mix(#000, $moonlight-melody, 20%);
.element {
color: $moonlight-melody;
box-shadow: 0 0 0 2px rgba($moonlight-melody, 0.35);
}