#05030FVoid
Fondo principal. Un escenario oscuro para el personaje y la luz.
--void
ANIVATAR / SISTEMA VISUAL WEB
La inteligencia adquiere carácter.
Color, tipografía, luz y las reglas que los unen en un solo lenguaje.
01 / ANIVATAR
Anivatar da a la tecnología un rostro, una voz y la capacidad de actuar. Las personas siguen en el centro de la experiencia.
PRINCIPIO FUNDAMENTAL
Humano y máquina. Oscuridad y luz espectral. Tipografía monumental y descripciones tranquilas y legibles. Cada pantalla tiene un momento visual dominante.
Presente y receptivo.
Audaz en escala y lenguaje.
Preciso y con un objetivo claro.
Cercano a las personas.
Sorprende mediante un cambio de ritmo.
02 / ANIVATAR
La paleta principal de la web. Cada muestra indica el color, su valor HEX y su uso. Los acentos saturados dirigen la mirada hacia lo importante.
#05030FFondo principal. Un escenario oscuro para el personaje y la luz.
--void#0B0824Paneles, galerías y superficies secundarias.
--deep-space#F7F5FFTexto principal sobre fondo oscuro.
--ghost#C9C5D6Descripciones, pies de imagen y texto secundario.
--mist#7226FFIdentidad de marca, energía y toques de luz.
--violet#F042FFExpresión, voz y puntos de énfasis visual.
--magenta#87F5F5Acciones principales, estados activos y foco del teclado.
--cyan#C8FF2EUn botón de contacto destacado y un acento para las llamadas a la acción.
#225CFFDegradados para títulos e iluminación de escenas.
#00CFFFEl acento VATAR del logotipo y los detalles luminosos.
#3A00FFUn acento espectral adicional.
#245BFFMódulos tecnológicos y flujo de datos.
#FBFDFFUna superficie de contraste para el manifiesto.
#FF4F68Un color semántico de error, siempre acompañado de un mensaje.
Colores complementarios de la guía de marca: Night Indigo #160078, Soft Photon #F4F3F8, Ink #0B0913 y Solar Orange #FF5A36. Estos colores pueden utilizarse en escenas y materiales futuros; arriba se muestran los colores principales de la web actual.
03 / ANIVATAR
La web utiliza Space Grotesk, Manrope y Oxanium. Cada una tiene una función fija y su tamaño se adapta al ancho de la pantalla.
01 / TÍTULOS
Títulos, cifras grandes y logotipo. Mensajes breves, escala audaz y ritmo compacto. Grosor predominante: 600.
IA que
te mira a los ojos.
Aa Bb 0123456789
Ą Ć Ę Ł Ń Ó Ś Ź Ż · ą ć ę ł ń ó ś ź ż
02 / TEXTO E INTERFAZ
Párrafos, formularios y botones. Texto principal: grosores 400–500. Énfasis y acciones: 600–700. Interlineado cómodo y lectura clara.
La tecnología empieza con una conversación.
Creamos personajes digitales que escuchan, responden y ayudan a actuar. El veloz zorro marrón salta sobre el perro perezoso.
Aa Bb 0123456789 · A B C D E F G
03 / ACENTO TECNOLÓGICO
Índices, microetiquetas, estados y navegación principal. Mayúsculas, espaciado entre letras ampliado y grosores de 500–600.
VOZ / HUMANO / IA
Sistema 01–08
Aa Bb 0123456789
Ą Ć Ę Ł Ń Ó Ś Ź Ż · ą ć ę ł ń ó ś ź ż
La escala tipográfica se adapta al ancho de la pantalla. Los grandes titulares llenan la escena. Los párrafos conservan una anchura cómoda para la lectura y un interlineado de aproximadamente 1,6. En móviles, los titulares tienen más interlineado para mostrar completos los signos diacríticos del polaco. Un degradado resalta un fragmento breve del titular.
04 / ANIVATAR
El logotipo original de Anivatar combina un perfil humano con un símbolo espectral fluido. Usamos la versión clara u oscura según el fondo.




Mantén el logotipo en una línea, conserva sus proporciones originales, colócalo sobre un fondo legible y deja espacio libre alrededor. Usa la misma grafía en la cabecera y el pie.
No estires el logotipo, cambies su tipografía, apliques colores o efectos arbitrarios ni coloques el símbolo sobre el rostro de un personaje o una imagen recargada.
05 / ANIVATAR
El degradado actúa como una fuente de luz: sobre el personaje, en un halo o en un fragmento breve del título. Los textos largos mantienen un color uniforme.
El degradado principal de la marca.
115° · #7226FF → #F042FF (44%) → #87F5F5Una variación utilizada en los títulos de las subpáginas.
90° · #225CFF → #F042FF → #87F5F5
Una mirada intencionada, un encuadre cercano y espacio para la tipografía. Dos temperaturas de color realzan el rostro, y una luz de contorno lo separa del fondo.
El fotorrealismo y la estilización pueden convivir. El encuadre, la iluminación y la presentación crean coherencia.
Los motivos incluyen luz alrededor del personaje, el campo de voz y la línea de escaneo. Los iconos geométricos acompañan a etiquetas claras.
06 / ANIVATAR
Una cuadrícula flexible de 12 columnas, líneas técnicas y un ritmo cambiante: una gran escena, una descripción tranquila y otro acento potente.
En pantallas anchas, el margen lateral suele ser el 4 % del ancho, limitado a entre 24 y 72 px. En móviles suele ser de 20 px. El contenido y los botones permanecen siempre dentro del área segura.
Una acción individual utiliza un botón con forma de píldora. La elección entre opciones utiliza un rectángulo de esquinas rectas. La misma regla se aplica a los casos de uso, la galería, la descripción del proyecto y el chat. Los módulos de contenido se mantienen planos; en móviles, las columnas forman una secuencia legible.
07 / ANIVATAR
Cada acción tiene una etiqueta clara. El color, el contorno y el movimiento refuerzan su significado, mientras el foco del teclado identifica el elemento activo.
ACCIONES INDIVIDUALES / REDONDEADAS
Acción principal / Plasma Cyan + Void
Contacto / Acid Lime + Void
Acción secundaria / contorno sutil
SELECCIÓN DE OPCIONES / RECTANGULAR
Ghost y Mist sobre Void. Texto oscuro sobre Cyan, Magenta y Lime. Texto claro sobre Electric Violet. Siempre describimos un estado con una palabra o un icono, aunque cambie su color.
Respuesta de botones: 180 ms. Tiempos recomendados para la entrada de textos: 450–800 ms; cambios de escena: 700–1400 ms. El movimiento confirma una acción o un cambio de estado. La preferencia de movimiento reducido desactiva las animaciones innecesarias.
08 / ANIVATAR
Frases breves y audaces. Verbos en lugar de jerga. Explicamos la tecnología a través de lo que permite hacer.
Una personalidad.
Cada canal.
«Una historia que responde».
«Un hogar que entiende más que órdenes».
«Conocimientos técnicos justo donde se necesitan».
Conectamos la visión con el uso práctico. Explicamos a quién ayudamos y cómo. Evitamos los superlativos vacíos, las estadísticas sin respaldo y las promesas de sustituir a las personas.