Nazwany kolor · #776D90
Purple Silhouette
Purple Silhouette to #776D90: rgb(119 109 144), hsl(257 14% 50%), oklch(0.557 0.055 297.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Purple Silhouette color name →
#776D90
oklch(0.557 0.055 297.7)
Konwersje koloru
- HEX
- #776d90
- RGB
- rgb(119 109 144)
- HSL
- hsl(257 14% 50%)
- HWB
- hwb(257 43% 44%)
- OKLCH
- oklch(0.557 0.055 297.7)
- OKLab
- oklab(0.557 0.025 -0.048)
- CIE Lab
- lab(47.95 9.69 -17.79)
- LCH
- lch(47.95 20.26 298.6)
- CMYK
- cmyk(17% 24% 0% 44%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 847B9B
- 9189A6
- 9E97B1
- ABA5BC
- B9B4C7
- C6C2D2
- D4D1DD
- E2E0E8
- F1F0F4
Odcienie ciemniejsze
- 675E7D
- 574F6A
- 474157
- 383345
- 2A2634
- 1C1924
- 100D15
- 050407
- 010101
Tony
- 786F8F
- 79718D
- 7A738C
- 7A758A
- 7B7788
- 7C7987
- 7D7A85
- 7E7C83
- 7F7E82
Harmonie kolorów
Komplementarna +180°
- 776D90
Purple Silhouette
- 717853
≈ Kariyasu Green
Analogowa -30° +30°
- 776D90
Purple Silhouette
- 667394
≈ Ocean Night
- 856884
≈ Blackberry Jam
Triada +120° +240°
- 776D90
Purple Silhouette
- 8C6C54
≈ Bean Pot
- 4F7E73
≈ Azurite Water Green
Komplementarna rozszczepiona +150° +210°
- 776D90
Purple Silhouette
- 81724E
≈ Outrigger
- 5E7D61
≈ Korean Mint
Tetrada +90° +180° +270°
- 776D90
Purple Silhouette
- 916862
≈ Cloak of Mystery
- 717853
≈ Kariyasu Green
- 4B7D84
≈ Submerged
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.80:1 · APCA Lc 73
Ag
FailNa czerni
WCAG 4.37:1 · APCA Lc 28
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.80:1 (AA) · APCA Lc 73
Contrast pairs
Fragmenty kodu
CSS
:root {
--purple-silhouette: #776d90;
--purple-silhouette-rgb: 119 109 144;
--purple-silhouette-oklch: oklch(0.557 0.055 297.7);
}
.element {
color: var(--purple-silhouette);
background-color: hsl(257 14% 50%);
border-color: oklch(0.557 0.055 297.7);
}Tailwind CSS v4
@theme {
--color-purple-silhouette: #776d90;
--color-purple-silhouette-50: #f7f2ff;
--color-purple-silhouette-100: #eae4f8;
--color-purple-silhouette-200: #d7cfe9;
--color-purple-silhouette-300: #bbb2d0;
--color-purple-silhouette-400: #a298bb;
--color-purple-silhouette-500: #8a7fa6;
--color-purple-silhouette-600: #756b8d;
--color-purple-silhouette-700: #5d5671;
--color-purple-silhouette-800: #443f53;
--color-purple-silhouette-900: #2f2b3a;
--color-purple-silhouette-950: #1b1824;
}SCSS
$purple-silhouette: #776d90;
$purple-silhouette-rgb: 119, 109, 144;
$purple-silhouette-light: mix(#fff, $purple-silhouette, 20%);
$purple-silhouette-dark: mix(#000, $purple-silhouette, 20%);
.element {
color: $purple-silhouette;
box-shadow: 0 0 0 2px rgba($purple-silhouette, 0.35);
}