Benannte Farbe · #A7B0CC
Lovely Lilac
Lovely Lilac ist #A7B0CC: rgb(167 176 204), hsl(225 27% 73%), oklch(0.759 0.041 271.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Lovely Lilac color name →
#A7B0CC
oklch(0.759 0.041 271.3)
Farbumrechnungen
- HEX
- #a7b0cc
- RGB
- rgb(167 176 204)
- HSL
- hsl(225 27% 73%)
- HWB
- hwb(225 65% 20%)
- OKLCH
- oklch(0.759 0.041 271.3)
- OKLab
- oklab(0.759 0.001 -0.041)
- CIE Lab
- lab(71.81 1.14 -15.41)
- LCH
- lch(71.81 15.45 274.2)
- CMYK
- cmyk(18% 14% 0% 20%)
Tints · Shades · Tones
Tints
- AFB8D1
- B8BFD6
- C1C7DB
- C9CFE0
- D2D7E6
- DBDFEB
- E4E7F0
- EDEFF5
- F6F7FA
Shades
- 9199B1
- 7B8297
- 666C7E
- 525665
- 3E424E
- 2C2E37
- 1A1C22
- 0A0B0F
- 010102
Tones
- A3ABC4
- 9FA6BC
- 9BA1B5
- 979DAD
- 9398A5
- 8F939E
- 8B8E96
- 88898F
- 848587
Farbharmonien
Komplementär +180°
- A7B0CC
Lovely Lilac
- BAB094
≈ Flour Sack
Analog -30° +30°
- A7B0CC
Lovely Lilac
- 9AB5C9
≈ Country Air
- B5ABC8
≈ Lavender Dream
Triadisch +120° +240°
- A7B0CC
Lovely Lilac
- CAA8A1
≈ Teatime Mauve
- 9EB9A4
≈ Spearmint Haze
Geteilt komplementär +150° +210°
- A7B0CC
Lovely Lilac
- C5AB97
≈ Transcend
- ACB598
≈ Norwich Green
Tetradisch +90° +180° +270°
- A7B0CC
Lovely Lilac
- C9A6AF
≈ Dutchess Dawn
- BAB094
≈ Flour Sack
- 95BAB2
≈ Teal Tree
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.15:1 · APCA Lc 42
Ag
AAAAuf Schwarz
WCAG 9.72:1 · APCA Lc 60
Beste Textfarbe: #000000
WCAG 9.72:1 (AAA) · APCA Lc 60
Contrast pairs
Code-Snippets
CSS
:root {
--lovely-lilac: #a7b0cc;
--lovely-lilac-rgb: 167 176 204;
--lovely-lilac-oklch: oklch(0.759 0.041 271.3);
}
.element {
color: var(--lovely-lilac);
background-color: hsl(225 27% 73%);
border-color: oklch(0.759 0.041 271.3);
}Tailwind CSS v4
@theme {
--color-lovely-lilac: #a7b0cc;
--color-lovely-lilac-50: #f1f5ff;
--color-lovely-lilac-100: #e3e7f6;
--color-lovely-lilac-200: #ced3e7;
--color-lovely-lilac-300: #b0b6cd;
--color-lovely-lilac-400: #959eb8;
--color-lovely-lilac-500: #7c85a2;
--color-lovely-lilac-600: #697189;
--color-lovely-lilac-700: #545a6e;
--color-lovely-lilac-800: #3c4251;
--color-lovely-lilac-900: #2a2e38;
--color-lovely-lilac-950: #171a23;
}SCSS
$lovely-lilac: #a7b0cc;
$lovely-lilac-rgb: 167, 176, 204;
$lovely-lilac-light: mix(#fff, $lovely-lilac, 20%);
$lovely-lilac-dark: mix(#000, $lovely-lilac, 20%);
.element {
color: $lovely-lilac;
box-shadow: 0 0 0 2px rgba($lovely-lilac, 0.35);
}