Color
La familia fría en un matiz, el terracota como detalle y la proporción que los mantiene en su lugar.
La paleta
Ink
Paper
Navy → Depth
Ultramarino
Terracota
Graphite
Fog
White
Todo lo frío es un solo matiz
Tinta, navy, grafito, niebla y el azul de acción son el mismo azul a distintas intensidades — no grises neutros con un acento encima. Eso es lo que hace que la paleta se lea como sistema y no como colores surtidos.
El terracota es lo único que sale de la familia, y sale a propósito.
- Inkmatiz 231
- Navymatiz 231
- Depthmatiz 231
- Ultramarinomatiz 231
- Graphitematiz 231
- Fogmatiz 231
- Papermatiz 231
Proporción: el terracota es un detalle
El volumen lo cargan el papel, la tinta y el navy. El ultramarino es la única acción. El terracota vive en piezas chicas: un chip, un badge, un subrayado, un control secundario, un nodo en un diagrama.
Nunca es fondo de página, nunca es un campo grande, nunca una superficie mayor que un control. Si una vista se lee como «azul y naranjo», el naranjo se pasó.
- Papel y blanco
- ~75%
- Tinta y navy
- ~15%
- Ultramarino
- ~7%
- Terracota
- ~3%
El terracota lleva tinta, nunca blanco
Es consecuencia de ser mate, no un defecto. Un terracota lo bastante claro para que el blanco pase ya dejó de ser mate y se convirtió en naranjo señal.
Para texto terracota sobre fondo claro existe el paso --sds-terracotta-700, que sí pasa sobre papel.
Intervino una persona
Intervino una persona
Rampas
Solo dos. Los estados de producto no tienen rampa propia: usan sus tokens semánticos, que están en 11 · Densidad y estados.
ultramarino
terracota
Roles semánticos
- Black
Solo la marca. Nunca texto ni superficie.
- Ink
Texto primario y campos oscuros. Lleva una traza del azul de la familia.
- Navy
Profundidad de marca. Carga el volumen junto al papel.
- Depth
Paso intermedio del gradiente navy → ultramarino.
- Ultramarino
La única acción: botones, enlaces, foco. Nada más es azul.
- Paper
Atmósfera de página. Las superficies van en blanco puro.
- White
Superficies elevadas y evidencia de producto.
- Fog
Divisiones y atmósfera. No sirve como borde de control.
- Graphite
Texto secundario y chrome tranquilo.
- Terracota
Detalle. Tope ~3% de la vista. Lleva tinta, nunca blanco.
- Jade
Resuelto, conectado, sano. Solo producto.
- Honey
Oportunidad y revisión. Solo producto.
- Crimson
Error y bloqueo. Solo producto.
Los dos modos
La landing es clara en esta fase. El producto necesita los dos, y el azul de acción no es el mismo valor en cada uno: #1e3ce6 sobre una superficie oscura da 2.3:1 y es ilegible.
Claro
Lead calificado
Responde en 4 minutos
Oscuro
Lead calificado
Responde en 4 minutos
- Matiz de la familia
- 231
- Acción · claro
- #1E3CE6
- Acción · oscuro
- #7086FF
- Acento · matiz
- 18
- Acento · saturación
- 52%
- Tope de terracota
- ~3% de la vista