Nazwany kolor · #6E8FB4
Hushed Lilac
Hushed Lilac to #6E8FB4: rgb(110 143 180), hsl(212 32% 57%), oklch(0.639 0.067 251.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Hushed Lilac color name →
#6E8FB4
oklch(0.639 0.067 251.7)
Konwersje koloru
- HEX
- #6e8fb4
- RGB
- rgb(110 143 180)
- HSL
- hsl(212 32% 57%)
- HWB
- hwb(212 43% 29%)
- OKLCH
- oklch(0.639 0.067 251.7)
- OKLab
- oklab(0.639 -0.021 -0.064)
- CIE Lab
- lab(57.97 -4.71 -23.42)
- LCH
- lch(57.97 23.89 258.6)
- CMYK
- cmyk(39% 21% 0% 29%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 7C9ABC
- 8AA5C3
- 98B0CB
- A6BBD2
- B5C6DA
- C3D1E1
- D2DDE9
- E1E8F0
- F0F3F8
Odcienie ciemniejsze
- 5F7C9C
- 506985
- 41576E
- 334558
- 263444
- 192430
- 0E151D
- 04070C
- 010102
Tony
- 708EAF
- 728CAA
- 748BA5
- 76899F
- 78889A
- 798695
- 7B8590
- 7D838B
- 7E8285
Harmonie kolorów
Komplementarna +180°
- 6E8FB4
Hushed Lilac
- A6865E
≈ Rich Oak
Analogowa -30° +30°
- 6E8FB4
Hushed Lilac
- 5C96A9
≈ Deep Diving
- 8587B4
≈ Iolite
Triada +120° +240°
- 6E8FB4
Hushed Lilac
- B17B81
≈ Taffeta Darling
- 7D956A
≈ Green Eyes
Komplementarna rozszczepiona +150° +210°
- 6E8FB4
Hushed Lilac
- B07F6C
≈ Crushed Clay
- 948E5D
≈ Nile Reed
Tetrada +90° +180° +270°
- 6E8FB4
Hushed Lilac
- A97C98
≈ Cali Lily
- A6865E
≈ Rich Oak
- 66997F
≈ Practice Green
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.35:1 · APCA Lc 61
Ag
AANa czerni
WCAG 6.25:1 · APCA Lc 41
Najlepszy kolor tekstu: #000000
WCAG 6.25:1 (AA) · APCA Lc 41
Contrast pairs
Fragmenty kodu
CSS
:root {
--hushed-lilac: #6e8fb4;
--hushed-lilac-rgb: 110 143 180;
--hushed-lilac-oklch: oklch(0.639 0.067 251.7);
}
.element {
color: var(--hushed-lilac);
background-color: hsl(212 32% 57%);
border-color: oklch(0.639 0.067 251.7);
}Tailwind CSS v4
@theme {
--color-hushed-lilac: #6e8fb4;
--color-hushed-lilac-50: #e8f7ff;
--color-hushed-lilac-100: #d9eaff;
--color-hushed-lilac-200: #c1d6f1;
--color-hushed-lilac-300: #a0bada;
--color-hushed-lilac-400: #82a2c6;
--color-hushed-lilac-500: #6589b2;
--color-hushed-lilac-600: #567496;
--color-hushed-lilac-700: #445d78;
--color-hushed-lilac-800: #304459;
--color-hushed-lilac-900: #212f3e;
--color-hushed-lilac-950: #101c27;
}SCSS
$hushed-lilac: #6e8fb4;
$hushed-lilac-rgb: 110, 143, 180;
$hushed-lilac-light: mix(#fff, $hushed-lilac, 20%);
$hushed-lilac-dark: mix(#000, $hushed-lilac, 20%);
.element {
color: $hushed-lilac;
box-shadow: 0 0 0 2px rgba($hushed-lilac, 0.35);
}