Nazwany kolor · #AF9FCA
Purple Rose
Purple Rose to #AF9FCA: rgb(175 159 202), hsl(262 29% 71%), oklch(0.731 0.064 301.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Purple Rose color name →
#AF9FCA
oklch(0.731 0.064 301.8)
Konwersje koloru
- HEX
- #af9fca
- RGB
- rgb(175 159 202)
- HSL
- hsl(262 29% 71%)
- HWB
- hwb(262 62% 21%)
- OKLCH
- oklch(0.731 0.064 301.8)
- OKLab
- oklab(0.731 0.034 -0.054)
- CIE Lab
- lab(68 12.36 -19.94)
- LCH
- lch(68 23.46 301.8)
- CMYK
- cmyk(13% 21% 0% 21%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B7A8CF
- BEB2D5
- C6BBDA
- CEC5DF
- D6CEE5
- DED8EA
- E6E2EF
- EFEBF5
- F7F5FA
Odcienie ciemniejsze
- 988AAF
- 817595
- 6B617C
- 564D64
- 413B4D
- 2E2937
- 1C1822
- 0B090F
- 010102
Tony
- AA9CC2
- A599BB
- A196B3
- 9C93AC
- 9790A5
- 928C9D
- 8E8996
- 89868F
- 858387
Harmonie kolorów
Komplementarna +180°
- AF9FCA
Purple Rose
- A1AF82
≈ Fresh Guacamole
Analogowa -30° +30°
- AF9FCA
Purple Rose
- 9AA6D1
≈ Venus Flower
- C09ABA
≈ Dripping Wisteria
Triada +120° +240°
- AF9FCA
Purple Rose
- C69F7F
≈ Meringue Tips
- 7AB6AB
≈ Intracoastal
Komplementarna rozszczepiona +150° +210°
- AF9FCA
Purple Rose
- B6A77A
≈ Texas Sage
- 8BB494
≈ Monarch’s Cocoon
Tetrada +90° +180° +270°
- AF9FCA
Purple Rose
- CD9A8F
≈ Calliope
- A1AF82
≈ Fresh Guacamole
- 78B3BF
≈ Glacier
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.43:1 · APCA Lc 48
Ag
AAANa czerni
WCAG 8.63:1 · APCA Lc 54
Najlepszy kolor tekstu: #000000
WCAG 8.63:1 (AAA) · APCA Lc 54
Contrast pairs
Fragmenty kodu
CSS
:root {
--purple-rose: #af9fca;
--purple-rose-rgb: 175 159 202;
--purple-rose-oklch: oklch(0.731 0.064 301.8);
}
.element {
color: var(--purple-rose);
background-color: hsl(262 29% 71%);
border-color: oklch(0.731 0.064 301.8);
}Tailwind CSS v4
@theme {
--color-purple-rose: #af9fca;
--color-purple-rose-50: #f9f1ff;
--color-purple-rose-100: #ece3fa;
--color-purple-rose-200: #daceeb;
--color-purple-rose-300: #beb0d3;
--color-purple-rose-400: #a596be;
--color-purple-rose-500: #8e7caa;
--color-purple-rose-600: #78698f;
--color-purple-rose-700: #605473;
--color-purple-rose-800: #463d55;
--color-purple-rose-900: #302a3c;
--color-purple-rose-950: #1c1825;
}SCSS
$purple-rose: #af9fca;
$purple-rose-rgb: 175, 159, 202;
$purple-rose-light: mix(#fff, $purple-rose, 20%);
$purple-rose-dark: mix(#000, $purple-rose, 20%);
.element {
color: $purple-rose;
box-shadow: 0 0 0 2px rgba($purple-rose, 0.35);
}