Color con nombre · #188BC2
Cyan Cornflower Blue
Cyan Cornflower Blue es #188BC2: rgb(24 139 194), hsl(199 78% 43%), oklch(0.604 0.125 236.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Blue mean? → · Cyan Cornflower Blue color name →
#188BC2
oklch(0.604 0.125 236.7)
Conversiones de color
- HEX
- #188bc2
- RGB
- rgb(24 139 194)
- HSL
- hsl(199 78% 43%)
- HWB
- hwb(199 9% 24%)
- OKLCH
- oklch(0.604 0.125 236.7)
- OKLab
- oklab(0.604 -0.069 -0.105)
- CIE Lab
- lab(54.01 -15.68 -37.76)
- LCH
- lch(54.01 40.89 247.4)
- CMYK
- cmyk(88% 28% 0% 24%)
Tintes · Sombras · Tonos
Tintes
- 3D97C9
- 57A2CF
- 6EAED6
- 83BADC
- 98C5E2
- ADD1E8
- C1DCEE
- D6E8F4
- EAF3F9
Sombras
- 1378A8
- 0F668F
- 0A5477
- 074360
- 043249
- 022334
- 011420
- 00070E
- 000102
Tonos
- 2E8ABC
- 3D8AB5
- 4989AF
- 5388A8
- 5C87A2
- 64869B
- 6C8494
- 73838E
- 7A8287
Armonías de color
Complementario +180°
- 188BC2
Cyan Cornflower Blue
- B86B2A
≈ Brown Alpaca
Análogo -30° +30°
- 188BC2
Cyan Cornflower Blue
- 0092A0
≈ Jaded
- 5F7DCC
≈ Serenity’s Reign
Triádico +120° +240°
- 188BC2
Cyan Cornflower Blue
- BB5F83
≈ Beauty Queen
- 7D8A22
≈ Sassy Grass
Complementario dividido +150° +210°
- 188BC2
Cyan Cornflower Blue
- C16158
≈ Barbecue
- A17B00
≈ Hornet Yellow
Tetrádico +90° +180° +270°
- 188BC2
Cyan Cornflower Blue
- A865A8
≈ Iris Orchid
- B86B2A
≈ Brown Alpaca
- 489553
≈ Discover Deco
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 3.81:1 · APCA Lc 65
Ag
AASobre negro
WCAG 5.51:1 · APCA Lc 37
Mejor color de texto: #000000
WCAG 5.51:1 (AA) · APCA Lc 37
Contrast pairs
Fragmentos de código
CSS
:root {
--cyan-cornflower-blue: #188bc2;
--cyan-cornflower-blue-rgb: 24 139 194;
--cyan-cornflower-blue-oklch: oklch(0.604 0.125 236.7);
}
.element {
color: var(--cyan-cornflower-blue);
background-color: hsl(199 78% 43%);
border-color: oklch(0.604 0.125 236.7);
}Tailwind CSS v4
@theme {
--color-cyan-cornflower-blue: #188bc2;
--color-cyan-cornflower-blue-50: #d5fbff;
--color-cyan-cornflower-blue-100: #c2efff;
--color-cyan-cornflower-blue-200: #a2dcff;
--color-cyan-cornflower-blue-300: #78c1f0;
--color-cyan-cornflower-blue-400: #4aa9df;
--color-cyan-cornflower-blue-500: #0091ce;
--color-cyan-cornflower-blue-600: #037aae;
--color-cyan-cornflower-blue-700: #06628b;
--color-cyan-cornflower-blue-800: #004867;
--color-cyan-cornflower-blue-900: #013248;
--color-cyan-cornflower-blue-950: #001e2f;
}SCSS
$cyan-cornflower-blue: #188bc2;
$cyan-cornflower-blue-rgb: 24, 139, 194;
$cyan-cornflower-blue-light: mix(#fff, $cyan-cornflower-blue, 20%);
$cyan-cornflower-blue-dark: mix(#000, $cyan-cornflower-blue, 20%);
.element {
color: $cyan-cornflower-blue;
box-shadow: 0 0 0 2px rgba($cyan-cornflower-blue, 0.35);
}