Nazwany kolor · #5C84B4
Deepest Periwinkle
Deepest Periwinkle to #5C84B4: rgb(92 132 180), hsl(213 37% 53%), oklch(0.604 0.086 253.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Deepest Periwinkle color name →
#5C84B4
oklch(0.604 0.086 253.6)
Konwersje koloru
- HEX
- #5c84b4
- RGB
- rgb(92 132 180)
- HSL
- hsl(213 37% 53%)
- HWB
- hwb(213 36% 29%)
- OKLCH
- oklch(0.604 0.086 253.6)
- OKLab
- oklab(0.604 -0.024 -0.083)
- CIE Lab
- lab(53.7 -4.03 -30.08)
- LCH
- lch(53.7 30.35 262.4)
- CMYK
- cmyk(49% 27% 0% 29%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 6C90BC
- 7B9CC3
- 8BA8CB
- 9BB4D3
- ACC0DA
- BCCDE2
- CCD9E9
- DDE6F0
- EEF2F8
Odcienie ciemniejsze
- 4F729C
- 426085
- 364F6E
- 2A3F58
- 1F2F44
- 142030
- 0A121D
- 03060C
- 000102
Tony
- 6084AF
- 6484AA
- 6883A5
- 6B83A0
- 6F839B
- 738295
- 768290
- 79818B
- 7D8185
Harmonie kolorów
Komplementarna +180°
- 5C84B4
Deepest Periwinkle
- A07944
≈ Goldenrod Tea
Analogowa -30° +30°
- 5C84B4
Deepest Periwinkle
- 3E8CA7
≈ Magic Blue
- 7A7AB3
≈ Ontario Violet
Triada +120° +240°
- 5C84B4
Deepest Periwinkle
- AF6B72
≈ Mauvewood
- 6C8D57
≈ Irish Charm
Komplementarna rozszczepiona +150° +210°
- 5C84B4
Deepest Periwinkle
- AD7056
≈ Arizona Clay
- 8A8443
≈ Galia Melon
Tetrada +90° +180° +270°
- 5C84B4
Deepest Periwinkle
- A66C8E
≈ Cure All
- A07944
≈ Goldenrod Tea
- 4B9273
≈ Green Weed
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.87:1 · APCA Lc 66
Ag
AANa czerni
WCAG 5.41:1 · APCA Lc 36
Najlepszy kolor tekstu: #000000
WCAG 5.41:1 (AA) · APCA Lc 36
Contrast pairs
Fragmenty kodu
CSS
:root {
--deepest-periwinkle: #5c84b4;
--deepest-periwinkle-rgb: 92 132 180;
--deepest-periwinkle-oklch: oklch(0.604 0.086 253.6);
}
.element {
color: var(--deepest-periwinkle);
background-color: hsl(213 37% 53%);
border-color: oklch(0.604 0.086 253.6);
}Tailwind CSS v4
@theme {
--color-deepest-periwinkle: #5c84b4;
--color-deepest-periwinkle-50: #e5f7ff;
--color-deepest-periwinkle-100: #d5eaff;
--color-deepest-periwinkle-200: #bcd7f9;
--color-deepest-periwinkle-300: #9abae4;
--color-deepest-periwinkle-400: #7aa1d1;
--color-deepest-periwinkle-500: #5c89be;
--color-deepest-periwinkle-600: #4f74a1;
--color-deepest-periwinkle-700: #3f5d81;
--color-deepest-periwinkle-800: #2b445f;
--color-deepest-periwinkle-900: #1d2f43;
--color-deepest-periwinkle-950: #0d1c2b;
}SCSS
$deepest-periwinkle: #5c84b4;
$deepest-periwinkle-rgb: 92, 132, 180;
$deepest-periwinkle-light: mix(#fff, $deepest-periwinkle, 20%);
$deepest-periwinkle-dark: mix(#000, $deepest-periwinkle, 20%);
.element {
color: $deepest-periwinkle;
box-shadow: 0 0 0 2px rgba($deepest-periwinkle, 0.35);
}