Color dinámico
Toda la paleta sale del color de tu marca
Material Design 3 en todo el sitio
El frontend está construido sobre el sistema de diseño de Google, el mismo que usan Android, Gmail y YouTube. No es un diseño inspirado en Material: es su implementación, con su color, su tipografía, sus formas y sus componentes.
Color dinámico: tu marca, aplicada con criterio
En lugar de elegir a mano veinte colores, se define el color de la marca y el sistema deriva la paleta completa: principal, secundarios, acentos, fondos, contenedores y el color de texto que va sobre cada uno.
Coherencia automática
Todo el sitio usa la misma familia de colores, sin excepciones ni improvisaciones por sección.
Contraste por construcción
El sistema calcula qué color de texto va sobre cada fondo. No hay textos ilegibles.
Rebrand en minutos
Cambiar el color de la marca actualiza el sitio entero. No hay que revisar página por página.
Se define desde el panel
El tema es contenido editable, no una decisión congelada en el código. Sin tocar nada ni esperar un despliegue.
Un tema por marca
Cada marca de la organización tiene el suyo, sobre el mismo sistema y los mismos componentes.
Tipografía: jerarquía clara con las fuentes de tu marca
La escala del sistema trae tamaños, pesos e interlineados ya resueltos. Es lo que hace que una página se escanee en segundos, aunque el contenido lo carguen diez personas distintas.
Fuente de display
La de los grandes titulares, la que carga la personalidad de la marca.
Fuente de headline y texto
La de los títulos de sección y el cuerpo, elegida por legibilidad antes que por gusto.
Google Fonts optimizadas
Listas para usar y cargadas de forma diferida, para no penalizar la velocidad del sitio.
Forma, elevación y una biblioteca de componentes MD3
El redondeo y la profundidad son la palanca de personalidad de la marca: dos sitios MD3 se ven distintos sin salirse del sistema. Y las páginas se arman con piezas que ya traen comportamiento, estados y accesibilidad.
Forma
Un nivel de redondeo general para todo el sitio, desde bordes rectos hasta muy redondeados, ajustable por componente.
Elevación
La profundidad se expresa con las sombras del sistema, en niveles definidos. Una tarjeta destacada puede elevarse más que las del listado.
Contenido y destacados
Secciones, tarjetas, tiles, texto enriquecido, multimedia, hero, promos y glances.
Navegación y listados
Navigation rail, pestañas, listas de enlaces, grillas de productos y casos con sus filtros, y carruseles.
Configurable por pieza
Color, redondeo, elevación y bordes se ajustan desde el editor. Si no se toca nada, cada pieza toma el valor de la marca.
Diseño adaptable: un sitio para todas las pantallas
Material Design define clases de tamaño de ventana y qué debe pasar con el layout en cada una. No se trata de achicar el diseño de escritorio, sino de reacomodarlo.
Layouts que se reorganizan
Las grillas cambian de columnas, la navegación cambia de forma y los espaciados se ajustan.
Ancho por sección
Angosto para lectura, normal, o a todo lo ancho para las piezas visuales.
Móvil desde el arranque
Que es de donde viene la mayoría del tráfico, y no un ajuste que se hace al final.
Modo claro y oscuro, y accesibilidad que no depende del ojo
Los dos modos se generan con el mismo sistema de color, a partir del color de marca. Y el contraste, el foco y el movimiento vienen resueltos por los lineamientos, no por el criterio de quien carga el contenido.
Fijo, automático o a elección
La marca lo fija, el sitio sigue la preferencia del dispositivo, o el visitante elige y se recuerda.
Sin parpadeo al cargar
El modo y los colores se aplican desde el primer instante. Nada de página blanca que después se pone oscura.
Foco y teclado
Estados de foco visibles y navegación por teclado, como parte de los lineamientos del sistema.
Respeta menos movimiento
Si el visitante activó reducir el movimiento en su dispositivo, el sitio desactiva las animaciones solo.
Otros módulos de la plataforma
El sistema de diseño sostiene todo lo demás: las grillas de producto del módulo de ecommerce, las de casos de éxito y el tema propio de cada marca salen de los mismos tokens y los mismos componentes.
Todos los módulos
El catálogo completo de la plataforma: SEO, catálogo, casos de éxito, multimarca, CRM e IA.