Paleta Minimal Color Palette
Blanco, blanco roto, gris medio y casi negro. Nada más. Máxima claridad.
minimalistaneutrolimpio
#FFFFFF
#F5F5F5
#9E9E9E
#212121
#ffffff #f5f5f5 #9e9e9e #212121
#FFFFFF #F5F5F5 #9E9E9E #212121
Roles semánticos
Asignados de forma determinista: el más claro = fondo, el más oscuro = texto, el más saturado = primario.
| background | #FFFFFF | |
| surface | #F5F5F5 | |
| text | #212121 | |
| text-muted | #9E9E9E | |
| primary | #F5F5F5 | |
| secondary | #9E9E9E | |
| accent | #9E9E9E |
Variables CSS
:root {
--background: #ffffff;
--surface: #f5f5f5;
--text: #212121;
--text-muted: #9e9e9e;
--primary: #f5f5f5;
--secondary: #9e9e9e;
--accent: #9e9e9e;
}Matriz de accesibilidad
Color del texto (filas) sobre el fondo (columnas). Verde = cumple WCAG AA para texto normal (≥4.5:1).
| Texto \ Fondo | #FFFFFF | #F5F5F5 | #9E9E9E | #212121 |
|---|---|---|---|---|
| #FFFFFF | 1.0 | 1.1 | 2.7 | 16.1 |
| #F5F5F5 | 1.1 | 1.0 | 2.5 | 14.8 |
| #9E9E9E | 2.7 | 2.5 | 1.0 | 6.0 |
| #212121 | 16.1 | 14.8 | 6.0 | 1.0 |
Bajo deuteranopía
Simulación de Machado et al. (2009), severidad 1.0 — aproximación, no es una herramienta médica.
Colores de esta paleta
Paletas similares
Preguntas frecuentes
¿Cómo uso la paleta Minimal Color Palette en CSS?
Copia las variables CSS de abajo en :root y usa var(--primary), var(--background), etc. Paleta completa: #FFFFFF, #F5F5F5, #9E9E9E, #212121.
¿Estos colores pasan las comprobaciones de accesibilidad?
Consulta la matriz WCAG de esta página: cada combinación texto-sobre-fondo con ratio ≥ 4.5 cumple AA para texto normal; ≥ 3 cumple AA para texto grande y componentes de interfaz.