Colore con nome · #606788
Champion Blue
Champion Blue è #606788: rgb(96 103 136), hsl(229 17% 45%), oklch(0.521 0.053 275.1). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Champion Blue color name →
#606788
oklch(0.521 0.053 275.1)
Conversioni di colore
- HEX
- #606788
- RGB
- rgb(96 103 136)
- HSL
- hsl(229 17% 45%)
- HWB
- hwb(229 38% 47%)
- OKLCH
- oklch(0.521 0.053 275.1)
- OKLab
- oklab(0.521 0.005 -0.053)
- CIE Lab
- lab(43.97 3.33 -19.32)
- LCH
- lch(43.97 19.6 279.8)
- CMYK
- cmyk(29% 24% 0% 47%)
Tinte · Ombre · Toni
Tinte
- 6F7594
- 7D849F
- 8D92AB
- 9CA1B7
- ACB0C2
- BCC0CE
- CCCFDA
- DDDFE7
- EEEFF3
Ombre
- 525975
- 454B63
- 383D52
- 2C3041
- 202331
- 151722
- 0A0C13
- 030406
- 000001
Toni
- 636A87
- 666C87
- 696F86
- 6D7185
- 707485
- 737684
- 767983
- 797B82
- 7D7E81
Armonie di colore
Complementare +180°
- 606788
Champion Blue
- 726946
≈ Austere
Analogo -30° +30°
- 606788
Champion Blue
- 4F6D86
≈ Oceanic
- 706282
≈ Posy Purple
Triadico +120° +240°
- 606788
Champion Blue
- 855E54
≈ Hanover Brick
- 50725C
≈ Green Valley
Complementare divisa +150° +210°
- 606788
Champion Blue
- 7F6349
≈ Bonnie’s Bench
- 626F4D
≈ Greenfield
Tetradico +90° +180° +270°
- 606788
Champion Blue
- 845D65
≈ Rose Garland
- 726946
≈ Austere
- 44736D
≈ Sinkhole
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.53:1 · APCA Lc 78
Ag
FailSu nero
WCAG 3.79:1 · APCA Lc 24
Miglior colore del testo: #FFFFFF
WCAG 5.53:1 (AA) · APCA Lc 78
Contrast pairs
Frammenti di codice
CSS
:root {
--champion-blue: #606788;
--champion-blue-rgb: 96 103 136;
--champion-blue-oklch: oklch(0.521 0.053 275.1);
}
.element {
color: var(--champion-blue);
background-color: hsl(229 17% 45%);
border-color: oklch(0.521 0.053 275.1);
}Tailwind CSS v4
@theme {
--color-champion-blue: #606788;
--color-champion-blue-50: #f1f4ff;
--color-champion-blue-100: #e3e7fa;
--color-champion-blue-200: #ced3eb;
--color-champion-blue-300: #b0b5d3;
--color-champion-blue-400: #959dbe;
--color-champion-blue-500: #7c84aa;
--color-champion-blue-600: #69708f;
--color-champion-blue-700: #545973;
--color-champion-blue-800: #3c4155;
--color-champion-blue-900: #292d3b;
--color-champion-blue-950: #171a25;
}SCSS
$champion-blue: #606788;
$champion-blue-rgb: 96, 103, 136;
$champion-blue-light: mix(#fff, $champion-blue, 20%);
$champion-blue-dark: mix(#000, $champion-blue, 20%);
.element {
color: $champion-blue;
box-shadow: 0 0 0 2px rgba($champion-blue, 0.35);
}