Es el primario azul de sRGB, no un azul cielo pálido. Solo el canal azul está al máximo: resulta intenso, pero su luminancia relativa es mucho menor que la del primario verde.
Este HEX también tiene un nombre CSS.
Colores que se acompañan.
Complementaria
Dos colores separados por 180° en el círculo HSL. Sus matices opuestos crean un contraste marcado.
Pruébalo en enlaces o detalles gráficos sobre una página clara. Subraya los enlaces o distínguelos de otra forma para que su función no dependa solo del color.
Los consejos de diseño dependen del contexto y se distinguen de los cálculos.
Qué revisar antes de usarlo
Un azul vivo no tiene por qué ser luminoso. Compara el texto blanco y negro de abajo en vez de elegir según la intensidad aparente.
#0000ff equivale a rgb(0, 0, 255), hsl(240, 100%, 50%) y oklch(0.45201372 0.31321437 264.052021). Todos se calculan a partir del mismo color sRGB opaco.
¿Qué texto se lee mejor sobre #0000ff?
El negro da 2.44:1 y el blanco 8.59:1. Entre ambos, Blanco tiene más contraste. AA para texto normal exige al menos 4,5:1.
¿Cómo se calcula la paleta complementaria?
El motor gira el matiz HSL 180° y mantiene saturación y luminosidad. Para este color el resultado es #0000ff, #ffff00. Los acromáticos siguen siendo neutros.
¿Por qué el azul parece más oscuro que el lima con la misma luminosidad HSL?
La luminosidad HSL se calcula a partir de los extremos de los canales RGB, no del brillo percibido. WCAG pondera los canales de otra manera; OKLCH también permite comparar la luminosidad perceptual.
Las sugerencias de diseño son subjetivas. Los ángulos de matiz y las relaciones de contraste son cálculos.
Usos sugeridos
Páginas editoriales, marcas de estilo de vida e interfaces tranquilas.
Ventaja
Los matices vecinos dan continuidad visual.
Qué conviene tener en cuenta
Pueden difuminar los límites: añade etiquetas y espacio neutro.
Ejemplo de aplicación
Reserva el matiz central para el bloque principal y sus vecinos para tarjetas decorativas.
OKLCH · Ajustes perceptuales
Ajusta la luminosidad y el croma de los colores compañeros libres en OKLCH. La separación de matices HSL puede cambiar. Compara el resultado antes de aplicarlo.
Paleta actual
Vista previa del ajuste
Colores cuyo croma se ha reducido para sRGB: 0
El color base permanece fijo. Ni este ni los colores bloqueados cambian al regenerar o ajustar.
Comparar con la armonía HSL original
Estos son los colores teóricos sin editar. Compara sus valores HEX y OKLCH con la paleta de arriba.
Combinación de texto aplicada #ffffff / #0000ff · 8.59:1
your-next-idea.design
FORM & FIELDIdeas libres. Colores elegidos con cuidado.
UN ESTUDIO PARA LAS IDEAS COTIDIANAS
Espacio para otra mirada.
Las nuevas ideas suelen empezar con un poco de curiosidad.
Descubrir la colección
La pareja de texto y fondo no alcanza AA para texto normal.
#8000ff / #0000ff · 1.38:1 · Texto normal · AA
Texto alternativo sugerido: #ffffff (8.59:1).
Contraste del texto mostrado: 8.59:1 · Los colores de texto accesibles solo afectan a la vista previa. Tu paleta no cambia.
La pareja comprobada se usa en botones, tarjetas, indicadores y franjas de diapositiva con color. El resto del texto usa #262a23 (13.18:1) o #55594f (6.47:1) sobre #f6f3ec. Los gráficos tienen números. No es una auditoría completa de accesibilidad.
Comprobador de contraste de texto
Accesibilidad / WCAG AA
Que también se pueda leer.
Compara el color seleccionado con un color de texto o de fondo.
AA exige 4,5:1 para texto normal y 3:1 para texto grande. Esta prueba no determina el cumplimiento completo de WCAG.
Aa
Disfruta del color sin renunciar a la lectura.
#0000ff / #ffffff
Relación de contraste8.59:1
Texto normal · AACumple
Texto grande · AACumple
Texto normal · AAACumple
Texto grande · AAACumple
Un poco de teoría para explorar.
PALUNEXA gira los matices en el círculo HSL y conserva la saturación y la luminosidad. Las paletas monocromáticas varían la luminosidad. La armonía calculada es un punto de partida, no una garantía de que el diseño guste a todo el mundo.