Nazwany kolor · #956D9A
Lavender Crystal
Lavender Crystal to #956D9A: rgb(149 109 154), hsl(293 18% 52%), oklch(0.591 0.082 322.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Lavender Crystal color name →
#956D9A
oklch(0.591 0.082 322.7)
Konwersje koloru
- HEX
- #956d9a
- RGB
- rgb(149 109 154)
- HSL
- hsl(293 18% 52%)
- HWB
- hwb(293 43% 40%)
- OKLCH
- oklch(0.591 0.082 322.7)
- OKLab
- oklab(0.591 0.065 -0.049)
- CIE Lab
- lab(51.39 22.36 -18.1)
- LCH
- lch(51.39 28.76 321)
- CMYK
- cmyk(3% 29% 0% 40%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 9F7BA4
- AA89AE
- B497B8
- BFA5C2
- C9B4CC
- D4C3D6
- DFD2E0
- E9E1EA
- F4F0F5
Odcienie ciemniejsze
- 815E85
- 6D4F71
- 5A415E
- 48334B
- 372639
- 261927
- 160D17
- 080409
- 010101
Tony
- 936F98
- 917195
- 8F7392
- 8D7590
- 8B778D
- 89798B
- 877B88
- 857D85
- 827E83
Harmonie kolorów
Komplementarna +180°
- 956D9A
Lavender Crystal
- 608A5D
≈ Hippie Green
Analogowa -30° +30°
- 956D9A
Lavender Crystal
- 7F74AA
≈ Old Prune
- A46982
≈ Strawberry Mousse
Triada +120° +240°
- 956D9A
Lavender Crystal
- 957942
≈ Manticore Brown
- 368C93
≈ Aqueous
Komplementarna rozszczepiona +150° +210°
- 956D9A
Lavender Crystal
- 7E8348
≈ Fresh Artichoke
- 438D79
≈ Perky
Tetrada +90° +180° +270°
- 956D9A
Lavender Crystal
- A4704F
≈ Drum Solo
- 608A5D
≈ Hippie Green
- 4786A6
≈ Underwater Moonlight
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.25:1 · APCA Lc 69
Ag
AANa czerni
WCAG 4.93:1 · APCA Lc 32
Najlepszy kolor tekstu: #000000
WCAG 4.93:1 (AA) · APCA Lc 32
Contrast pairs
Fragmenty kodu
CSS
:root {
--lavender-crystal: #956d9a;
--lavender-crystal-rgb: 149 109 154;
--lavender-crystal-oklch: oklch(0.591 0.082 322.7);
}
.element {
color: var(--lavender-crystal);
background-color: hsl(293 18% 52%);
border-color: oklch(0.591 0.082 322.7);
}Tailwind CSS v4
@theme {
--color-lavender-crystal: #956d9a;
--color-lavender-crystal-50: #ffeeff;
--color-lavender-crystal-100: #f6dff7;
--color-lavender-crystal-200: #e7c9e8;
--color-lavender-crystal-300: #cdaacf;
--color-lavender-crystal-400: #b68ebb;
--color-lavender-crystal-500: #a074a6;
--color-lavender-crystal-600: #87628c;
--color-lavender-crystal-700: #6d4e70;
--color-lavender-crystal-800: #4f3954;
--color-lavender-crystal-900: #37273a;
--color-lavender-crystal-950: #221524;
}SCSS
$lavender-crystal: #956d9a;
$lavender-crystal-rgb: 149, 109, 154;
$lavender-crystal-light: mix(#fff, $lavender-crystal, 20%);
$lavender-crystal-dark: mix(#000, $lavender-crystal, 20%);
.element {
color: $lavender-crystal;
box-shadow: 0 0 0 2px rgba($lavender-crystal, 0.35);
}