Alfa y composición CSS
Canales alfa y opacidad del color en CSS
Aprende cómo se diferencian alfa en HEX de ocho dígitos, la sintaxis funcional, transparent y opacity al componer colores en CSS.
Conocimiento práctico del color
Artículos basados en métodos, no en mitología.
Guías detalladas en español, inglés, ruso y francés, basadas en normas publicadas, cálculos reproducibles y ejemplos CSS listos para copiar.
Estados accesibles de enlaces
Elegir colores de enlace que sigan siendo distinguibles
Elige y prueba colores de enlace frente al fondo y al texto próximo, conservando subrayado, estado visitado, hover y foco de teclado.
Formularios accesibles
Colores de estado de formulario que no dependen solo del color
Diseña estados de error, éxito, aviso, desactivado y foco comprensibles sin color, con el contraste pertinente y una respuesta clara para cada persona.
Fundamentos del color HEX
Cómo leer un código de color HEX de seis dígitos
Lee cualquier color #RRGGBB a mano: separa sus canales, convierte parejas hexadecimales, reconoce abreviaturas y descifra una pareja alfa opcional.
Estados de botón accesibles
Colores de botones: texto, relleno, borde, hover y focus
Evalúa el texto, el relleno, el borde y los estados de sobrevuelo, activación, deshabilitación y foco como interacciones completas, no como una muestra aislada.
Los niveles WCAG explicados
Umbrales de contraste WCAG AA y AAA sin mitos
Aprende qué significan realmente WCAG AA y AAA para texto normal y grande, cómo se acumulan los niveles de conformidad y qué no puede certificar un verificador de contraste.
Formatos de color CSS
HEX, RGB y HSL: qué cambia y qué no
Aprende cómo HEX, RGB y HSL representan colores CSS, cómo convertir un color sin modificarlo y cómo elegir la notación adecuada para cada tarea.
Selección práctica del primer plano
Cómo elegir un color de texto legible para cualquier fondo
Aplica un proceso reproducible para comparar colores de texto sobre fondos sólidos, translúcidos, degradados y fotográficos con ejemplos WCAG comprobados.
Contraste WCAG 2.2
La relación de contraste de color explicada con ejemplos verificados
Calcula el contraste WCAG 2.2 de dos colores sRGB, interpreta los umbrales AA y AAA y examina ejemplos exactos que aprueban o suspenden.
Controles HSL prácticos
Valores de color HSL: controles útiles y errores frecuentes
Usa HSL en CSS de forma deliberada con ejemplos sRGB exactos, escalas de saturación y luminosidad, comprobaciones de contraste, sintaxis alpha y límites perceptivos.
Controles HWB prácticos
Colores HWB: blancura y negrura en CSS
Usa HWB en CSS con conversiones sRGB exactas, rampas probadas de blancura y negrura, contraste, normalización de sumas, sintaxis alpha y tokens prácticos.
Flujo perceptivo para paletas CSS
OKLCH para paletas CSS prácticas
Crea paletas CSS prácticas con luminosidad y chroma OKLCH, conversiones sRGB probadas, evidencia de contraste, límites de gamut, fallbacks, degradados y mezcla de colores.
Comparación de colores
Cómo se calcula el nombre de color CSS más cercano
Descubre cómo comparar un color con el conjunto fijo de colores CSS, por qué la métrica cambia el ganador y por qué la palabra devuelta es una aproximación, no un nombre autoritativo.
Modo claro accesible
Crear una paleta de colores legible para el modo claro
Crea una paleta legible de modo claro coordinando superficies blancas, niveles de texto, bordes, acentos, foco, composición y contraste WCAG.
Paleta para interfaz oscura
Crear una paleta de modo oscuro sin limitarse a invertir colores
Construye una paleta de modo oscuro medible para superficies, texto, bordes, acentos y foco sin recurrir a la inversión automática.
Visualización de datos accesible
Una paleta de colores práctica para gráficos y categorías
Crea gráficos categóricos con etiquetas, formas, patrones, orden y contraste medido para que los datos sigan siendo comprensibles sin diferencias de color.
Palabras clave de color CSS
Colores CSS con nombre: cuándo ayudan y cuándo HEX es más claro
Usa correctamente las palabras clave de color CSS: comprueba sus valores sRGB exactos, reconoce alias y nombres sorprendentes y elige tokens mantenibles.
Sintaxis de color CSS
Sintaxis moderna de color CSS con ejemplos listos para copiar
Compara HEX, rgb(), hsl(), hwb(), lab() y oklch() modernos en CSS, distingue sus espacios de color y copia ejemplos sin cambiar un color por accidente.
Colores relacionados sin nombres vagos
Tintes, sombras y tonos: tres operaciones diferentes
Genera tintes, sombras y tonos con matemáticas sRGB explícitas, ejemplos HEX reproducibles, CSS color-mix() y comprobaciones de contraste en lugar de etiquetas ambiguas.
Tokens de color CSS
Cómo organizar un pequeño sistema de color con variables CSS
Crea un pequeño sistema de color mantenible con propiedades CSS, tokens semánticos, alcance controlado, fallbacks, temas y pruebas de contraste.