Cor nomeada · #5566AA
Submarine Base
Submarine Base é #5566AA: rgb(85 102 170), hsl(228 33% 50%), oklch(0.528 0.109 271.6). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Submarine Base color name →
#5566AA
oklch(0.528 0.109 271.6)
Conversões de cor
- HEX
- #5566aa
- RGB
- rgb(85 102 170)
- HSL
- hsl(228 33% 50%)
- HWB
- hwb(228 33% 33%)
- OKLCH
- oklch(0.528 0.109 271.6)
- OKLab
- oklab(0.528 0.003 -0.109)
- CIE Lab
- lab(44.21 8.36 -39.13)
- LCH
- lch(44.21 40.02 282.1)
- CMYK
- cmyk(50% 40% 0% 33%)
Tons claros · Sombras · Tons
Tons claros
- 6475B3
- 7484BC
- 8493C5
- 95A2CD
- A6B1D6
- B7C0DE
- C8D0E7
- DADFEF
- EDEFF7
Sombras
- 495893
- 3D4A7D
- 313C68
- 262F53
- 1C233F
- 11172D
- 080C1B
- 02040B
- 000001
Tons
- 5969A6
- 5D6CA2
- 616F9E
- 66729A
- 6A7496
- 6E7792
- 73798E
- 777B89
- 7C7E85
Harmonias de cor
Complementar +180°
- 5566AA
Submarine Base
- 826800
≈ Muddy Brown
Análoga -30° +30°
- 5566AA
Submarine Base
- 2272A4
≈ Quarterdeck
- 775BA0
≈ Sumire Violet
Tríade +120° +240°
- 5566AA
Submarine Base
- A05142
≈ Boynton Canyon
- 317D4A
≈ Bold Irish
Complementar dividida +150° +210°
- 5566AA
Submarine Base
- 975B1B
≈ Sepia Wash
- 617522
≈ Fern Frond
Tétrade +90° +180° +270°
- 5566AA
Submarine Base
- 9D4E67
≈ Cherry Berry
- 826800
≈ Muddy Brown
- 007D6F
≈ Blue Green
Contraste e acessibilidade
Ag
AASobre branco
WCAG 5.43:1 · APCA Lc 77
Ag
FailSobre preto
WCAG 3.86:1 · APCA Lc 25
Melhor cor de texto: #FFFFFF
WCAG 5.43:1 (AA) · APCA Lc 77
Contrast pairs
Trechos de código
CSS
:root {
--submarine-base: #5566aa;
--submarine-base-rgb: 85 102 170;
--submarine-base-oklch: oklch(0.528 0.109 271.6);
}
.element {
color: var(--submarine-base);
background-color: hsl(228 33% 50%);
border-color: oklch(0.528 0.109 271.6);
}Tailwind CSS v4
@theme {
--color-submarine-base: #5566aa;
--color-submarine-base-50: #ebf4ff;
--color-submarine-base-100: #dce6ff;
--color-submarine-base-200: #c5d2ff;
--color-submarine-base-300: #a5b4f0;
--color-submarine-base-400: #879adf;
--color-submarine-base-500: #6d81ce;
--color-submarine-base-600: #5c6dae;
--color-submarine-base-700: #49578c;
--color-submarine-base-800: #334068;
--color-submarine-base-900: #232c49;
--color-submarine-base-950: #121930;
}SCSS
$submarine-base: #5566aa;
$submarine-base-rgb: 85, 102, 170;
$submarine-base-light: mix(#fff, $submarine-base, 20%);
$submarine-base-dark: mix(#000, $submarine-base, 20%);
.element {
color: $submarine-base;
box-shadow: 0 0 0 2px rgba($submarine-base, 0.35);
}