Najbliższy nazwany kolor · #60325B
#60325B
Najbliższy nazwany kolor: Opulent Purple
#60325B (rgb(96 50 91), hsl(307 32% 29%), oklch(0.392 0.089 331.2)) jest najbliższy nazwanemu kolorowi Opulent Purple. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#60325B
oklch(0.392 0.089 331.2)
Konwersje koloru
- HEX
- #60325b
- RGB
- rgb(96 50 91)
- HSL
- hsl(307 32% 29%)
- HWB
- hwb(307 20% 62%)
- OKLCH
- oklch(0.392 0.089 331.2)
- OKLab
- oklab(0.392 0.078 -0.043)
- CIE Lab
- lab(28.18 26.06 -15.5)
- LCH
- lch(28.18 30.32 329.3)
- CMYK
- cmyk(0% 48% 5% 62%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 6F456A
- 7F587A
- 8E6B8A
- 9E7F9A
- AE94AA
- BEA8BA
- CEBDCB
- DED3DC
- EFE9EE
Odcienie ciemniejsze
- 522A4E
- 452241
- 381B35
- 2C1429
- 200D1E
- 150713
- 0A0309
- 030103
- 000000
Tony
- 643A5F
- 674263
- 6B4A66
- 6E516A
- 71596E
- 746171
- 776975
- 7A7079
- 7D787C
Harmonie kolorów
Komplementarna +180°
- 60325B
Opulent Purple
- 18532C
≈ Moor-Monster
Analogowa -30° +30°
- 60325B
Opulent Purple
- 4E396D
≈ Succinct Violet
- 6B2F42
≈ Wine Dregs
Triada +120° +240°
- 60325B
Opulent Purple
- 554300
≈ Sugarloaf Brown
- 004F5A
≈ Kali Blue
Komplementarna rozszczepiona +150° +210°
- 60325B
Opulent Purple
- 3F4C09
≈ No Emissions Green
- 005248
≈ Green Oblivion
Tetrada +90° +180° +270°
- 60325B
Opulent Purple
- 673804
≈ Nutmeg Wood Finish
- 18532C
≈ Moor-Monster
- 064A70
≈ Broadwater Blue
Kontrast i dostępność
Ag
AAANa bieli
WCAG 9.97:1 · APCA Lc 93
Ag
FailNa czerni
WCAG 2.10:1 · APCA Lc 10
Najlepszy kolor tekstu: #FFFFFF
WCAG 9.97:1 (AAA) · APCA Lc 93
Contrast pairs
Fragmenty kodu
CSS
:root {
--opulent-purple: #60325b;
--opulent-purple-rgb: 96 50 91;
--opulent-purple-oklch: oklch(0.392 0.089 331.2);
}
.element {
color: var(--opulent-purple);
background-color: hsl(307 32% 29%);
border-color: oklch(0.392 0.089 331.2);
}Tailwind CSS v4
@theme {
--color-opulent-purple: #60325b;
--color-opulent-purple-50: #ffecff;
--color-opulent-purple-100: #fbdef5;
--color-opulent-purple-200: #ecc7e5;
--color-opulent-purple-300: #d4a7cb;
--color-opulent-purple-400: #bd8bb6;
--color-opulent-purple-500: #a870a1;
--color-opulent-purple-600: #8e5f88;
--color-opulent-purple-700: #724c6d;
--color-opulent-purple-800: #533751;
--color-opulent-purple-900: #3a2639;
--color-opulent-purple-950: #241423;
}SCSS
$opulent-purple: #60325b;
$opulent-purple-rgb: 96, 50, 91;
$opulent-purple-light: mix(#fff, $opulent-purple, 20%);
$opulent-purple-dark: mix(#000, $opulent-purple, 20%);
.element {
color: $opulent-purple;
box-shadow: 0 0 0 2px rgba($opulent-purple, 0.35);
}