Color con nombre · #337EFF
Ceruleite
Ceruleite es #337EFF: rgb(51 126 255), hsl(218 100% 60%), oklch(0.619 0.206 260.5). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Blue mean? → · Ceruleite color name →
#337EFF
oklch(0.619 0.206 260.5)
Conversiones de color
- HEX
- #337eff
- RGB
- rgb(51 126 255)
- HSL
- hsl(218 100% 60%)
- HWB
- hwb(218 20% 0%)
- OKLCH
- oklch(0.619 0.206 260.5)
- OKLab
- oklab(0.619 -0.034 -0.203)
- CIE Lab
- lab(53.77 12.86 -72.13)
- LCH
- lch(53.77 73.27 280.1)
- CMYK
- cmyk(80% 51% 0% 0%)
Tintes · Sombras · Tonos
Tintes
- 498DFF
- 5E9AFF
- 73A8FF
- 87B5FF
- 9AC2FF
- AECEFF
- C2DBFF
- D6E7FF
- EBF3FF
Sombras
- 2B6DDE
- 235CBE
- 1C4C9E
- 143C80
- 0D2D63
- 071F48
- 03112E
- 010516
- 000103
Tonos
- 3D80F3
- 4781E6
- 4F82DA
- 5783CD
- 5F83C1
- 6683B4
- 6D83A7
- 73829B
- 7A818D
Armonías de color
Complementario +180°
- 337EFF
Ceruleite
- AD7C00
≈ Brown Butter
Análogo -30° +30°
- 337EFF
Ceruleite
- 0092C2
≈ Surf Rider
- 8A66F6
≈ Purple Anemone
Triádico +120° +240°
- 337EFF
Ceruleite
- E73C4E
≈ Desire
- 2AA100
≈ Space Invader
Complementario dividido +150° +210°
- 337EFF
Ceruleite
- CF6200
≈ Brusque Brown
- 8B8C00
≈ Palak Paneer
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 3.77:1 · APCA Lc 65
Ag
AASobre negro
WCAG 5.56:1 · APCA Lc 37
Mejor color de texto: #000000
WCAG 5.56:1 (AA) · APCA Lc 37
Contrast pairs
Fragmentos de código
CSS
:root {
--ceruleite: #337eff;
--ceruleite-rgb: 51 126 255;
--ceruleite-oklch: oklch(0.619 0.206 260.5);
}
.element {
color: var(--ceruleite);
background-color: hsl(218 100% 60%);
border-color: oklch(0.619 0.206 260.5);
}Tailwind CSS v4
@theme {
--color-ceruleite: #337eff;
--color-ceruleite-50: #d6f6ff;
--color-ceruleite-100: #c3e8ff;
--color-ceruleite-200: #a5d4ff;
--color-ceruleite-300: #7db5ff;
--color-ceruleite-400: #5299ff;
--color-ceruleite-500: #267cff;
--color-ceruleite-600: #2369e1;
--color-ceruleite-700: #1b54b5;
--color-ceruleite-800: #093e88;
--color-ceruleite-900: #062b60;
--color-ceruleite-950: #001742;
}SCSS
$ceruleite: #337eff;
$ceruleite-rgb: 51, 126, 255;
$ceruleite-light: mix(#fff, $ceruleite, 20%);
$ceruleite-dark: mix(#000, $ceruleite, 20%);
.element {
color: $ceruleite;
box-shadow: 0 0 0 2px rgba($ceruleite, 0.35);
}