Nazwany kolor · #784674
Purple Passion
Purple Passion to #784674: rgb(120 70 116), hsl(305 26% 37%), oklch(0.47 0.094 329.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Purple Passion color name →
#784674
oklch(0.47 0.094 329.9)
Konwersje koloru
- HEX
- #784674
- RGB
- rgb(120 70 116)
- HSL
- hsl(305 26% 37%)
- HWB
- hwb(305 27% 53%)
- OKLCH
- oklch(0.47 0.094 329.9)
- OKLab
- oklab(0.47 0.082 -0.047)
- CIE Lab
- lab(37.17 27.53 -17.25)
- LCH
- lch(37.17 32.49 327.9)
- CMYK
- cmyk(0% 42% 3% 53%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 855781
- 93698F
- A07B9C
- AD8DAA
- BB9FB8
- C8B2C6
- D6C5D4
- E4D8E2
- F1EBF0
Odcienie ciemniejsze
- 673C64
- 573254
- 482845
- 391E37
- 2A1529
- 1D0D1B
- 10050F
- 050205
- 010001
Tony
- 794C75
- 7A5277
- 7B5878
- 7C5E79
- 7D647A
- 7E697C
- 7F6F7D
- 7F757E
- 807A7F
Harmonie kolorów
Komplementarna +180°
- 784674
Purple Passion
- 2E693D
≈ Billiard Ball
Analogowa -30° +30°
- 784674
Purple Passion
- 634E88
≈ Sumptuous Purple
- 854259
≈ Wild Plum
Triada +120° +240°
- 784674
Purple Passion
- 6F5805
≈ Hot Mustard
- 006774
≈ Bankson Lake
Komplementarna rozszczepiona +150° +210°
- 784674
Purple Passion
- 54621D
≈ Tabbouleh Green
- 006A5C
≈ Fresh Ivy Green
Tetrada +90° +180° +270°
- 784674
Purple Passion
- 814C1B
≈ Milk Chocolate
- 2E693D
≈ Billiard Ball
- 1B618A
≈ Copenhagen Blue
Kontrast i dostępność
Ag
AAANa bieli
WCAG 7.17:1 · APCA Lc 85
Ag
FailNa czerni
WCAG 2.92:1 · APCA Lc 17
Najlepszy kolor tekstu: #FFFFFF
WCAG 7.17:1 (AAA) · APCA Lc 85
Contrast pairs
Fragmenty kodu
CSS
:root {
--purple-passion: #784674;
--purple-passion-rgb: 120 70 116;
--purple-passion-oklch: oklch(0.47 0.094 329.9);
}
.element {
color: var(--purple-passion);
background-color: hsl(305 26% 37%);
border-color: oklch(0.47 0.094 329.9);
}Tailwind CSS v4
@theme {
--color-purple-passion: #784674;
--color-purple-passion-50: #ffecff;
--color-purple-passion-100: #fcddf6;
--color-purple-passion-200: #edc6e7;
--color-purple-passion-300: #d5a6cd;
--color-purple-passion-400: #be8ab9;
--color-purple-passion-500: #a96ea4;
--color-purple-passion-600: #8f5e8b;
--color-purple-passion-700: #734b6f;
--color-purple-passion-800: #543653;
--color-purple-passion-900: #3b253a;
--color-purple-passion-950: #251424;
}SCSS
$purple-passion: #784674;
$purple-passion-rgb: 120, 70, 116;
$purple-passion-light: mix(#fff, $purple-passion, 20%);
$purple-passion-dark: mix(#000, $purple-passion, 20%);
.element {
color: $purple-passion;
box-shadow: 0 0 0 2px rgba($purple-passion, 0.35);
}