Nazwany kolor · #A6A1D7
Simply Violet
Simply Violet to #A6A1D7: rgb(166 161 215), hsl(246 40% 74%), oklch(0.732 0.078 288.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Simply Violet color name →
#A6A1D7
oklch(0.732 0.078 288.6)
Konwersje koloru
- HEX
- #a6a1d7
- RGB
- rgb(166 161 215)
- HSL
- hsl(246 40% 74%)
- HWB
- hwb(246 63% 16%)
- OKLCH
- oklch(0.732 0.078 288.6)
- OKLab
- oklab(0.732 0.025 -0.074)
- CIE Lab
- lab(68.13 10.49 -26.98)
- LCH
- lch(68.13 28.95 291.2)
- CMYK
- cmyk(23% 25% 0% 16%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- AEAADB
- B7B3DF
- C0BDE4
- C8C6E8
- D1CFEC
- DAD9F0
- E3E2F4
- ECECF7
- F6F5FB
Odcienie ciemniejsze
- 908BBB
- 7A769F
- 656285
- 514E6B
- 3E3C52
- 2B2A3B
- 1A1925
- 0A0911
- 010102
Tony
- A29ECE
- 9E9BC5
- 9A97BD
- 9694B4
- 9391AB
- 8F8DA2
- 8B8A9A
- 878791
- 848389
Harmonie kolorów
Komplementarna +180°
- A6A1D7
Simply Violet
- ACAD73
≈ Wasabi Green
Analogowa -30° +30°
- A6A1D7
Simply Violet
- 8BAADA
≈ Birdie Num Num
- BE99C8
≈ Crocus Petal
Triada +120° +240°
- A6A1D7
Simply Violet
- D19A7D
≈ Dusty Coral
- 76B9A0
≈ Arboretum
Komplementarna rozszczepiona +150° +210°
- A6A1D7
Simply Violet
- C3A370
≈ Hashibami Brown
- 90B585
≈ Aniseed Leaf Green
Tetrada +90° +180° +270°
- A6A1D7
Simply Violet
- D59596
≈ Keel Joy
- ACAD73
≈ Wasabi Green
- 69B8BB
≈ Fresh Soft Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.41:1 · APCA Lc 48
Ag
AAANa czerni
WCAG 8.70:1 · APCA Lc 54
Najlepszy kolor tekstu: #000000
WCAG 8.70:1 (AAA) · APCA Lc 54
Contrast pairs
Fragmenty kodu
CSS
:root {
--simply-violet: #a6a1d7;
--simply-violet-rgb: 166 161 215;
--simply-violet-oklch: oklch(0.732 0.078 288.6);
}
.element {
color: var(--simply-violet);
background-color: hsl(246 40% 74%);
border-color: oklch(0.732 0.078 288.6);
}Tailwind CSS v4
@theme {
--color-simply-violet: #a6a1d7;
--color-simply-violet-50: #f4f2ff;
--color-simply-violet-100: #e7e4ff;
--color-simply-violet-200: #d3cff4;
--color-simply-violet-300: #b7b1dd;
--color-simply-violet-400: #9c97ca;
--color-simply-violet-500: #847eb7;
--color-simply-violet-600: #706b9a;
--color-simply-violet-700: #59557c;
--color-simply-violet-800: #403e5c;
--color-simply-violet-900: #2c2b40;
--color-simply-violet-950: #191829;
}SCSS
$simply-violet: #a6a1d7;
$simply-violet-rgb: 166, 161, 215;
$simply-violet-light: mix(#fff, $simply-violet, 20%);
$simply-violet-dark: mix(#000, $simply-violet, 20%);
.element {
color: $simply-violet;
box-shadow: 0 0 0 2px rgba($simply-violet, 0.35);
}