Colore con nome · #6477A0
Costume Blue
Costume Blue è #6477A0: rgb(100 119 160), hsl(221 24% 51%), oklch(0.57 0.068 265.1). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Costume Blue color name →
#6477A0
oklch(0.57 0.068 265.1)
Conversioni di colore
- HEX
- #6477a0
- RGB
- rgb(100 119 160)
- HSL
- hsl(221 24% 51%)
- HWB
- hwb(221 39% 37%)
- OKLCH
- oklch(0.57 0.068 265.1)
- OKLab
- oklab(0.57 -0.006 -0.067)
- CIE Lab
- lab(49.73 0.81 -24.62)
- LCH
- lch(49.73 24.63 271.9)
- CMYK
- cmyk(38% 26% 0% 37%)
Tinte · Ombre · Toni
Tinte
- 7284A9
- 8191B3
- 909EBC
- 9FACC6
- AEB9CF
- BEC7D9
- CED5E2
- DEE3EC
- EEF1F5
Ombre
- 56678B
- 485776
- 3B4761
- 2E384E
- 222A3B
- 161C29
- 0B1019
- 030509
- 000101
Toni
- 67789D
- 6A799A
- 6C7A97
- 6F7B94
- 727C91
- 757D8D
- 787E8A
- 7A7E87
- 7D7F83
Armonie di colore
Complementare +180°
- 6477A0
Costume Blue
- 8A7548
≈ Pickled Okra
Analogo -30° +30°
- 6477A0
Costume Blue
- 4E7E9A
≈ Flattering Blue
- 7A709C
≈ Queen’s
Triadico +120° +240°
- 6477A0
Costume Blue
- 9C6863
≈ Corazon
- 5E825F
≈ Soylent Green
Complementare divisa +150° +210°
- 6477A0
Costume Blue
- 976D50
≈ Toasted Bagel
- 767C4D
≈ Tara’s Drapes
Tetradico +90° +180° +270°
- 6477A0
Costume Blue
- 986779
≈ Arcane
- 8A7548
≈ Pickled Okra
- 498575
≈ Carlisle
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.47:1 · APCA Lc 71
Ag
AASu nero
WCAG 4.68:1 · APCA Lc 31
Miglior colore del testo: #000000
WCAG 4.68:1 (AA) · APCA Lc 31
Contrast pairs
Frammenti di codice
CSS
:root {
--costume-blue: #6477a0;
--costume-blue-rgb: 100 119 160;
--costume-blue-oklch: oklch(0.57 0.068 265.1);
}
.element {
color: var(--costume-blue);
background-color: hsl(221 24% 51%);
border-color: oklch(0.57 0.068 265.1);
}Tailwind CSS v4
@theme {
--color-costume-blue: #6477a0;
--color-costume-blue-50: #ecf5ff;
--color-costume-blue-100: #dee8ff;
--color-costume-blue-200: #c7d4f2;
--color-costume-blue-300: #a8b7db;
--color-costume-blue-400: #8b9ec7;
--color-costume-blue-500: #7086b4;
--color-costume-blue-600: #5f7198;
--color-costume-blue-700: #4c5a7a;
--color-costume-blue-800: #36425a;
--color-costume-blue-900: #252e3f;
--color-costume-blue-950: #141b28;
}SCSS
$costume-blue: #6477a0;
$costume-blue-rgb: 100, 119, 160;
$costume-blue-light: mix(#fff, $costume-blue, 20%);
$costume-blue-dark: mix(#000, $costume-blue, 20%);
.element {
color: $costume-blue;
box-shadow: 0 0 0 2px rgba($costume-blue, 0.35);
}