Fundamentos
Marca · Logo
El Waypoint
La marca de ATLVS es un waypoint : una estrella de navegación de ocho puntas con un vacío central, todo el sistema de navegación tallado en un único glifo geométrico. Registro SaaS neutral, recoloreado según el producto. Se distingue de la calavera del barco fantasma cósmico de GHXSTSHIP, que es la marca exclusiva de la empresa matriz.
La placa lleva el acento del producto; la estrella permanece blanca (o en tinta sobre fondos claros). El logotipo es siempre mayúsculas espaciadas y sin salto de línea: nunca en minúsculas, nunca sin espaciado salvo en URLs e identificadores.
| Especificación del logotipo | Composición |
|---|---|
| Fuente | Jost Geométrica, solo para el bloque del logo. Los títulos usan Anton; el cuerpo y la interfaz usan Hanken Grotesk. |
| La A | Un pico desnudo, sin travesaño, la V invertida. La A y la V se leen como formas en espejo. |
| Composición | Mayúsculas espaciadas, sin salto de línea. En el bloque completo, TECHNOLOGIES se espacia hasta el ancho exacto de ATLVS. |
| Subtítulo | Solo ATLVS lleva TECHNOLOGIES. Compass, Gateway y Legend van solos. |
Una marca, cuatro acentos
Cada producto es el mismo waypoint sobre su propia placa de acento: al instante una familia, al instante distinto.
Productor / Interno
Crew / Proveedor / Talento
Invitado / Cliente
Conocimiento / Aprendizaje
Neutro / Suite
Espacio de protección y uso
Mantén un margen igual a la mitad de la altura de la marca en cada lado.
- Recolorea la placa al acento del producto; mantén la estrella blanca (o en tinta sobre fondo claro).
- Mantén el espacio de protección = ½ de la altura de la marca.
- Usa la marca sin placa a ≤16px; el icono con placa a ≥32px.
- Combínala con el logotipo espaciado de A T L V S , sin salto de línea.
- Recolorear o aplicar degradado a la estrella misma; solo la placa lleva color.
- Rotar, estirar o añadir el semitono cósmico o la calavera.
- Componer el logotipo sin espaciado o en minúsculas.
- Colocar la marca sin placa sobre una foto recargada sin la placa sólida.
Fundamentos · Color
Color
Las superficies neutrales hacen el trabajo; un acento por producto porta la identidad. Cada valor se resuelve desde el espacio de nombres --p-* y se reajusta por modo para lograr contraste AA.
Fundamentos · Tipografía
Tipografía
Monument. Los títulos y las métricas se componen en Anton, una fuente de display ultracondensada en mayúsculas , un único peso negro que da al producto una presencia a escala de cartel. El cuerpo y la interfaz se mantienen en Hanken Grotesk para que tablas y formularios se lean nítidos; Space Mono es el lenguaje de los antetítulos y las coordenadas (identificadores, códigos, etiquetas); y Jost es exclusivamente el bloque construido del logotipo. Los títulos de display van en MAYÚSCULAS (Anton es una fuente de mayúsculas); el cuerpo y las etiquetas se mantienen en formato de título / oración.
Tres formas autorizadas de desplegar el titular ancho. Usa la adecuada para cada contexto; nunca mezcles más de una por vista.
Barra de acento + kicker mono en vivo. La opción por defecto para el chrome de la app y los encabezados de página.
Una palabra toma el acento del producto: los titulares se autobrandean. Portadas, marketing, splash.
Cifras tabulares a 900 / expandido. Paneles e informes.
Fundamentos · Espacio
Espaciado
Una rejilla base de 4px. La densidad intercambia el ritmo de controles y filas; los mismos tokens se ajustan bajo data-density="compact".
Fundamentos · Radio
Radios
Suaves, amigables con las herramientas de productividad; nunca afilados al estilo pop-art. Píldoras solo para chips y toggles.
Fundamentos · Elevación
Elevación
Una escala fría y ajustada de tres pasos: reposo → hover → popover y modal. Las sombras se mantienen sutiles en claro y se apoyan en bordes en oscuro.
Fundamentos · Movimiento
Movimiento
Rápido y sin aspavientos. Una curva de aceleración, duraciones cortas y una regla estricta: nunca animes una transición de un background respaldado por tokens durante un cambio de tema; recolorea al instante y anima filter o opacity en su lugar.
| Token | Valor | Uso |
|---|---|---|
--p-ease | 140ms cubic-bezier(.2,.7,.2,1) | Hover, pulsación, microinteracciones |
| Elevación al hover | translateY(-2px) + elev-2 | Tarjetas, mosaicos de estadísticas |
| Brillo de esqueleto | 1.4s ease, infinite | Marcadores de carga (respeta la reducción de movimiento) |
| Indicador de carga | 0.7s linear | Acciones en curso |
Fundamentos · Iconos
Iconografía
Phosphor Icons. Negrita para la interfaz, Relleno para sellos de estado y énfasis. Alinéalos con el texto a 16 a 20px; acciones independientes a 24px. Un solo color, heredando currentColor.