Nazwany kolor · #522F57
Grape Royale
Grape Royale to #522F57: rgb(82 47 87), hsl(293 30% 26%), oklch(0.366 0.08 322.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Grape Royale color name →
#522F57
oklch(0.366 0.08 322.4)
Konwersje koloru
- HEX
- #522f57
- RGB
- rgb(82 47 87)
- HSL
- hsl(293 30% 26%)
- HWB
- hwb(293 18% 66%)
- OKLCH
- oklch(0.366 0.08 322.4)
- OKLab
- oklab(0.366 0.063 -0.049)
- CIE Lab
- lab(25.24 21.88 -17.61)
- LCH
- lch(25.24 28.09 321.2)
- CMYK
- cmyk(6% 46% 0% 66%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 624267
- 735577
- 836987
- 947D97
- A591A8
- B7A6B9
- C8BCCA
- DAD2DB
- EDE8ED
Odcienie ciemniejsze
- 46274B
- 3B203E
- 2F1933
- 251227
- 1A0C1C
- 110612
- 080308
- 020103
- 000000
Tony
- 57375B
- 5B3F5F
- 604764
- 654F68
- 69576C
- 6E5F70
- 736774
- 776F78
- 7C787C
Harmonie kolorów
Komplementarna +180°
- 522F57
Grape Royale
- 234920
≈ Cal Poly Pomona Green
Analogowa -30° +30°
- 522F57
Grape Royale
- 403665
≈ Minsk
- 5D2B43
≈ Vistoris Lake
Triada +120° +240°
- 522F57
Grape Royale
- 523A00
≈ Pineapple
- 00484D
≈ Sherpa Blue
Komplementarna rozszczepiona +150° +210°
- 522F57
Grape Royale
- 404202
≈ Green Not Found
- 004A3B
≈ Aqua Deep
Tetrada +90° +180° +270°
- 522F57
Grape Royale
- 5E3110
≈ Baker’s Chocolate
- 234920
≈ Cal Poly Pomona Green
- 00455F
≈ Loyal Blue
Kontrast i dostępność
Ag
AAANa bieli
WCAG 11.03:1 · APCA Lc 95
Ag
FailNa czerni
WCAG 1.90:1 · APCA Lc 7
Najlepszy kolor tekstu: #FFFFFF
WCAG 11.03:1 (AAA) · APCA Lc 95
Contrast pairs
Fragmenty kodu
CSS
:root {
--grape-royale: #522f57;
--grape-royale-rgb: 82 47 87;
--grape-royale-oklch: oklch(0.366 0.08 322.4);
}
.element {
color: var(--grape-royale);
background-color: hsl(293 30% 26%);
border-color: oklch(0.366 0.08 322.4);
}Tailwind CSS v4
@theme {
--color-grape-royale: #522f57;
--color-grape-royale-50: #ffeeff;
--color-grape-royale-100: #f6dff7;
--color-grape-royale-200: #e6c9e8;
--color-grape-royale-300: #ccaacf;
--color-grape-royale-400: #b58fba;
--color-grape-royale-500: #9f74a5;
--color-grape-royale-600: #87638c;
--color-grape-royale-700: #6c4f70;
--color-grape-royale-800: #4f3953;
--color-grape-royale-900: #37273a;
--color-grape-royale-950: #221524;
}SCSS
$grape-royale: #522f57;
$grape-royale-rgb: 82, 47, 87;
$grape-royale-light: mix(#fff, $grape-royale, 20%);
$grape-royale-dark: mix(#000, $grape-royale, 20%);
.element {
color: $grape-royale;
box-shadow: 0 0 0 2px rgba($grape-royale, 0.35);
}