Najbliższy nazwany kolor · #835D9A
#835D9A
Najbliższy nazwany kolor: Ninja Princess
#835D9A (rgb(131 93 154), hsl(277 25% 48%), oklch(0.542 0.102 311.9)) jest najbliższy nazwanemu kolorowi Ninja Princess. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#835D9A
oklch(0.542 0.102 311.9)
Konwersje koloru
- HEX
- #835d9a
- RGB
- rgb(131 93 154)
- HSL
- hsl(277 25% 48%)
- HWB
- hwb(277 36% 40%)
- OKLCH
- oklch(0.542 0.102 311.9)
- OKLab
- oklab(0.542 0.068 -0.076)
- CIE Lab
- lab(45.44 24.79 -27.42)
- LCH
- lch(45.44 36.96 312.1)
- CMYK
- cmyk(15% 40% 0% 40%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 8F6CA4
- 9B7CAE
- A78CB8
- B39CC2
- C0ACCD
- CCBCD7
- D9CDE1
- E5DDEB
- F2EEF5
Odcienie ciemniejsze
- 715085
- 604371
- 4F375E
- 3F2A4B
- 2F1F39
- 201427
- 120A17
- 060309
- 010001
Tony
- 836198
- 836595
- 826893
- 826C90
- 826F8E
- 81738B
- 817689
- 817986
- 807D83
Harmonie kolorów
Komplementarna +180°
- 835D9A
Ninja Princess
- 597B3A
≈ Mangrove Leaf
Analogowa -30° +30°
- 835D9A
Ninja Princess
- 6667A9
≈ Blue Iris
- 975680
≈ Feminism
Triada +120° +240°
- 835D9A
Ninja Princess
- 936420
≈ Tapenade
- 00807D
≈ Belly Flop
Komplementarna rozszczepiona +150° +210°
- 835D9A
Ninja Princess
- 7B711D
≈ Wood Garlic
- 29815D
≈ Kākāriki Green
Tetrada +90° +180° +270°
- 835D9A
Ninja Princess
- A05A3E
≈ Ground Nutmeg
- 597B3A
≈ Mangrove Leaf
- 007C99
≈ Pacific Pleasure
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.25:1 · APCA Lc 76
Ag
FailNa czerni
WCAG 3.99:1 · APCA Lc 26
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.25:1 (AA) · APCA Lc 76
Contrast pairs
Fragmenty kodu
CSS
:root {
--ninja-princess: #835d9a;
--ninja-princess-rgb: 131 93 154;
--ninja-princess-oklch: oklch(0.542 0.102 311.9);
}
.element {
color: var(--ninja-princess);
background-color: hsl(277 25% 48%);
border-color: oklch(0.542 0.102 311.9);
}Tailwind CSS v4
@theme {
--color-ninja-princess: #835d9a;
--color-ninja-princess-50: #ffedff;
--color-ninja-princess-100: #f4deff;
--color-ninja-princess-200: #e4c8f3;
--color-ninja-princess-300: #caa8dc;
--color-ninja-princess-400: #b38dca;
--color-ninja-princess-500: #9d72b7;
--color-ninja-princess-600: #84609a;
--color-ninja-princess-700: #6a4d7c;
--color-ninja-princess-800: #4d385d;
--color-ninja-princess-900: #362641;
--color-ninja-princess-950: #211429;
}SCSS
$ninja-princess: #835d9a;
$ninja-princess-rgb: 131, 93, 154;
$ninja-princess-light: mix(#fff, $ninja-princess, 20%);
$ninja-princess-dark: mix(#000, $ninja-princess, 20%);
.element {
color: $ninja-princess;
box-shadow: 0 0 0 2px rgba($ninja-princess, 0.35);
}