Nazwany kolor · #A69F9A
Mauve Melody
Mauve Melody to #A69F9A: rgb(166 159 154), hsl(25 6% 63%), oklch(0.707 0.011 58.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Mauve Melody color name →
#A69F9A
oklch(0.707 0.011 58.1)
Konwersje koloru
- HEX
- #a69f9a
- RGB
- rgb(166 159 154)
- HSL
- hsl(25 6% 63%)
- HWB
- hwb(25 60% 35%)
- OKLCH
- oklch(0.707 0.011 58.1)
- OKLab
- oklab(0.707 0.006 0.009)
- CIE Lab
- lab(65.98 1.95 3.57)
- LCH
- lch(65.98 4.07 61.3)
- CMYK
- cmyk(0% 4% 7% 35%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- AFA8A4
- B7B2AD
- C0BBB7
- C9C4C1
- D2CECB
- DBD8D5
- E4E1E0
- EDEBEA
- F6F5F4
Odcienie ciemniejsze
- 908A85
- 7A7571
- 65615E
- 514D4B
- 3E3B39
- 2B2927
- 1A1817
- 0A0909
- 010101
Tony
- A29C97
- 9E9995
- 9A9692
- 979290
- 938F8D
- 8F8C8A
- 8B8988
- 878685
- 848383
Harmonie kolorów
Komplementarna +180°
- A69F9A
Mauve Melody
- 9BA2A7
≈ Metropolis Mood
Analogowa -30° +30°
- A69F9A
Mauve Melody
- A79E9D
≈ Nobel
- A3A099
≈ Stamped Concrete
Triada +120° +240°
- A69F9A
Mauve Melody
- 9AA3A0
≈ Belgian Block
- A19FA7
≈ Silver Sconce
Komplementarna rozszczepiona +150° +210°
- A69F9A
Mauve Melody
- 99A3A4
≈ Winter Flannel
- 9DA0A8
≈ Grey Wolf
Tetrada +90° +180° +270°
- A69F9A
Mauve Melody
- 9CA29D
≈ Brampton Grey
- 9BA2A7
≈ Metropolis Mood
- A49EA4
≈ Silver Sconce
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.60:1 · APCA Lc 51
Ag
AAANa czerni
WCAG 8.04:1 · APCA Lc 51
Najlepszy kolor tekstu: #000000
WCAG 8.04:1 (AAA) · APCA Lc 51
Contrast pairs
Fragmenty kodu
CSS
:root {
--mauve-melody: #a69f9a;
--mauve-melody-rgb: 166 159 154;
--mauve-melody-oklch: oklch(0.707 0.011 58.1);
}
.element {
color: var(--mauve-melody);
background-color: hsl(25 6% 63%);
border-color: oklch(0.707 0.011 58.1);
}Tailwind CSS v4
@theme {
--color-mauve-melody: #a69f9a;
--color-mauve-melody-50: #f7f4f2;
--color-mauve-melody-100: #ebe7e4;
--color-mauve-melody-200: #d8d3d0;
--color-mauve-melody-300: #bcb6b2;
--color-mauve-melody-400: #a49d98;
--color-mauve-melody-500: #8c857f;
--color-mauve-melody-600: #76706c;
--color-mauve-melody-700: #5f5a56;
--color-mauve-melody-800: #45413f;
--color-mauve-melody-900: #302d2b;
--color-mauve-melody-950: #1c1a19;
}SCSS
$mauve-melody: #a69f9a;
$mauve-melody-rgb: 166, 159, 154;
$mauve-melody-light: mix(#fff, $mauve-melody, 20%);
$mauve-melody-dark: mix(#000, $mauve-melody, 20%);
.element {
color: $mauve-melody;
box-shadow: 0 0 0 2px rgba($mauve-melody, 0.35);
}