Nazwany kolor · #6A8AA4
Sporty Blue
Sporty Blue to #6A8AA4: rgb(106 138 164), hsl(207 24% 53%), oklch(0.619 0.054 243.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Sporty Blue color name →
#6A8AA4
oklch(0.619 0.054 243.3)
Konwersje koloru
- HEX
- #6a8aa4
- RGB
- rgb(106 138 164)
- HSL
- hsl(207 24% 53%)
- HWB
- hwb(207 42% 36%)
- OKLCH
- oklch(0.619 0.054 243.3)
- OKLab
- oklab(0.619 -0.024 -0.048)
- CIE Lab
- lab(55.76 -6.67 -17.7)
- LCH
- lch(55.76 18.92 249.3)
- CMYK
- cmyk(35% 16% 0% 36%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 7895AD
- 87A1B6
- 95ACBF
- A4B8C8
- B3C3D1
- C2CFDA
- D1DBE3
- E0E7ED
- EFF3F6
Odcienie ciemniejsze
- 5B778E
- 4D6579
- 3F5364
- 314250
- 24323D
- 18222B
- 0D141A
- 04070A
- 000101
Tony
- 6C89A0
- 6F889D
- 718799
- 738696
- 768592
- 78848F
- 7A838B
- 7C8287
- 7E8184
Harmonie kolorów
Komplementarna +180°
- 6A8AA4
Sporty Blue
- 9D7F64
≈ Weaver’s Tool
Analogowa -30° +30°
- 6A8AA4
Sporty Blue
- 5F8F99
≈ Cabana Blue
- 7B84A7
≈ Romanesque
Triada +120° +240°
- 6A8AA4
Sporty Blue
- A27982
≈ Dusky Orchid
- 7F8C68
≈ Saladin
Komplementarna rozszczepiona +150° +210°
- 6A8AA4
Sporty Blue
- A37A71
≈ Burnished Brown
- 918661
≈ Owlet
Tetrada +90° +180° +270°
- 6A8AA4
Sporty Blue
- 9A7A94
≈ Valerian
- 9D7F64
≈ Weaver’s Tool
- 6D9077
≈ Cool Bluegrass
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.63:1 · APCA Lc 64
Ag
AANa czerni
WCAG 5.78:1 · APCA Lc 38
Najlepszy kolor tekstu: #000000
WCAG 5.78:1 (AA) · APCA Lc 38
Contrast pairs
Fragmenty kodu
CSS
:root {
--sporty-blue: #6a8aa4;
--sporty-blue-rgb: 106 138 164;
--sporty-blue-oklch: oklch(0.619 0.054 243.3);
}
.element {
color: var(--sporty-blue);
background-color: hsl(207 24% 53%);
border-color: oklch(0.619 0.054 243.3);
}Tailwind CSS v4
@theme {
--color-sporty-blue: #6a8aa4;
--color-sporty-blue-50: #e9f7ff;
--color-sporty-blue-100: #daeaf9;
--color-sporty-blue-200: #c2d7ea;
--color-sporty-blue-300: #a1bbd2;
--color-sporty-blue-400: #84a3bc;
--color-sporty-blue-500: #678ba7;
--color-sporty-blue-600: #58758d;
--color-sporty-blue-700: #465e71;
--color-sporty-blue-800: #324553;
--color-sporty-blue-900: #22303a;
--color-sporty-blue-950: #111c24;
}SCSS
$sporty-blue: #6a8aa4;
$sporty-blue-rgb: 106, 138, 164;
$sporty-blue-light: mix(#fff, $sporty-blue, 20%);
$sporty-blue-dark: mix(#000, $sporty-blue, 20%);
.element {
color: $sporty-blue;
box-shadow: 0 0 0 2px rgba($sporty-blue, 0.35);
}