La mayoría de las marcas que reviso tienen “sus colores”, pero nadie sabe qué color va encima de cuál. El resultado: textos blancos sobre amarillo que no se leen, botones que se pierden y una marca que cambia según quién la use.
Una paleta profesional responde tres preguntas: qué colores, en qué proporción y qué combinaciones están permitidas.
1. Los roles antes que los colores
Antes de elegir tonos, define qué trabajo hace cada color:
| Rol | Para qué se usa | Ejemplo en fipe.cl |
|---|---|---|
| Semilla / acción | Botones, enlaces, lo que pide un clic | Rosso #D33F2C |
| Tinta | Textos y fondos oscuros | #181312 |
| Fondo | La “hoja” donde vive todo | #F5F4F2 |
| Apoyo | Brillos, detalles, ilustración | Salmón #FF8C78 |
| Estado | Errores y confirmaciones (nunca decoración) | Carmín y verde |
2. El contraste se mide, no se opina
La norma internacional (WCAG) pide como mínimo:
- 4,5 : 1 para texto normal.
- 3 : 1 para texto grande (sobre 24 px, o 19 px en negrita) y para íconos.
Por eso en el manual no basta con escribir el HEX. Hay que escribir la tabla de pares:
| Par | Ratio | Veredicto |
|---|---|---|
| Tinta sobre fondo | 16,8 : 1 | ✅ Todo texto |
| Blanco sobre Rosso | 4,65 : 1 | ✅ Botones y CTA |
| Rosso sobre fondo | 4,2 : 1 | ⚠️ Solo titulares grandes; para texto chico, Rosso oscuro #B5321F (5,5 : 1) |
| Salmón sobre tinta | 8,1 : 1 | ✅ Destacados en fondos oscuros |
| Salmón sobre fondo | 2,1 : 1 | ❌ Prohibido para texto (solo decoración) |
Ese último renglón es el que más dinero ahorra: evita que alguien, en dos años más, haga un aviso ilegible.
3. Proporción: la regla 60 · 30 · 10
- 60 % fondo y neutros.
- 30 % tinta (textos, bloques oscuros).
- 10 % semilla. Si el rojo está en todas partes, deja de guiar la mirada.
4. Un color, cuatro códigos
Cada color del manual debe tener su versión para cada superficie: HEX/RGB (pantalla), CMYK (imprenta), Pantone (tinta exacta) y NCS o RAL (pintura y vinilo). Lo explico en detalle en cómo especificar el color para pintar un local.
5. Escríbelo también para la IA
Si tu equipo usa IA para hacer piezas, la tabla de contraste tiene que estar en un formato que la máquina lea. En los manuales de fipe.cl va en tokens.json y en MARCA.md, con la etiqueta PROHIBIDO en las combinaciones que no cumplen. Así la IA no “se inspira”: obedece.