Brand Refresh 2026
Sistema de diseño de Arbitrade.
Acceso restringido a usuarios autorizados.
Sistema de diseño de Arbitrade.
Acceso restringido a usuarios autorizados.
Sistema de diseño 2026. Una guía única para que todo lo que hagamos se sienta Arbitrade.
Arbitrade facilita el día a día de quienes pasan horas en el trabajo. Operamos retail desatendido —vending, micromarkets, café corners y smart shops— para empresas y organizaciones que quieren cuidar a su equipo con soluciones de alimentación bien resueltas. De ese propósito nace toda la estrategia visual y verbal que recoge este manual.
Cuatro ideas que sostienen la marca. Cada decisión de diseño, copy o servicio pasa por este filtro.
Modernidad, liderazgo, autoridad. Soluciones tecnológicas que marcan la vanguardia del retail desatendido.
Placer, bienestar, disfrute. Momentos pensados para desconectar, conectar de nuevo y recargar energía.
Comodidad y satisfacción sin fricciones. Interacciones intuitivas donde la tecnología se vuelve invisible.
Confianza, seguridad, tranquilidad. Estándares superiores y compromiso con la sostenibilidad.
Innovamos para hacer tu pausa diaria agradable y de calidad.
Si Arbitrade fuera una persona sería exigente pero cercana. Cuida los detalles, elige lo mejor, está disponible. Innovadora sin ser fría, profesional sin resultar distante, con un punto premium que se percibe en cómo hace las cosas.
Eleva el estándar en cada detalle. No improvisa. Trabaja con criterio y se nota en cada decisión.
Habla justo lo necesario. Estética cuidada, tono sereno, presencia limpia. Nunca grita.
Está al lado, no encima. Se comunica como una persona real, con honestidad y un punto de chispa cuando toca.
Dentro de una misma identidad convivimos con dos audiencias muy distintas. Saber a quién hablamos cambia qué elementos del manual elegimos para cada pieza: la paleta, la tipografía, el ritmo, la voz. Este manual reúne las herramientas para hacerlo bien en ambos lados.
Hablamos con empresas que confían parte de su día a día a Arbitrade. Aquí prima la calma profesional: ritmo pausado, paleta contenida, tipografía display con peso medido, datos al servicio del criterio. Transmitimos solidez sin frialdad.
Hablamos con personas que se encuentran nuestras máquinas y corners en su pausa. Aquí la pieza tiene que entrar rápido: jerarquía clara, mensaje directo, color al servicio del producto, gancho cuando toca empujar consumo. Energía contenida pero presente.
El imagotipo Arbitrade® combina el logotipo y el isotipo —grano, aroma y la A de Arbitrade. El isotipo funciona también solo, como motivo gráfico cuando hace falta presencia sin la palabra.
Reglas geométricas que aseguran que el imagotipo siempre se vea correcto, sea cual sea el soporte. La medida base, el espacio de respiración y el tamaño mínimo legible.
El módulo 1x equivale a la altura de la d del logotipo. Es la unidad sobre la que se construye toda la geometría de la marca.
Alrededor del imagotipo debe respetarse siempre un margen mínimo de 1x libre de cualquier otro elemento: texto, imagen, gráficos o el borde del soporte.
El imagotipo nunca aparece por debajo de 85 × 14 px en digital. Por debajo de esa medida pierde legibilidad y la "d" empieza a desaparecer.
El imagotipo completo se usa sobre los dos fondos principales: cream (por defecto) y oscuro.
Sobre cream
Sobre fondo oscuro
La marca también funciona reducida a su isotipo —la A. Útil en favicons, sellos, decoración a gran escala o aplicaciones donde el wordmark no cabe.
Sobre cream
Sobre oscuro
Sobre naranja
Una paleta organizada en tres grupos según el uso. El naranja como protagonista, los neutrales como atmósfera y los colores de acento para diferenciar categorías o dar versatilidad puntual.
El naranja Arbitrade. Identifica la marca, llama a la acción, dirige la atención. Aparece poco y bien — nunca como fondo grande, siempre como punto de foco.
Hacen el trabajo pesado del sistema: fondos, ambiente, tipografía. Cremas tostados que aportan calidez y un dark profundo para el texto y el contrapunto.
Cinco categorías que aportan énfasis y diferencian producto en comunicaciones B2C. De uso puntual — el naranja sigue siendo el ancla. Las gradaciones de cada uno se ven en el siguiente apartado.
Cada color de apoyo cuenta con 4 valores: 100 (fondo suave), 300 (acento), 500/600 (puro, por defecto) y 700 (oscuro, texto sobre claro). Para construir composiciones con profundidad sin perder coherencia.
El registro define qué parte de la paleta se activa. En lo corporativo nos contenemos; en lo de consumidor nos abrimos.
Comunicaciones cálidas y expresivas, pero contenidas. Solo neutrales (cream, dark) y el naranja Arbitrade. Los colores de categoría se reservan para diferenciar producto en composiciones puntuales.
Permitida toda la gama de apoyo para diferenciar líneas de producto, sectores o categorías dentro de un mismo soporte. El naranja sigue siendo el ancla.
No es una norma estricta, pero sí una proporción a vigilar. Si una pieza tiene más naranja que neutral, casi siempre algo no está funcionando.
Color que respira y reacciona. Los gradientes son uno de los gestos visuales propios de Arbitrade. Respiran solos, siguen el cursor con inercia, responden al click con un destello sutil.
Para piezas impresas, exports o cuando el motion no aplica, usar las versiones estáticas oficiales como referencia.
Dos familias variables. Fraunces para titulares y números con carácter editorial. DM Sans para interfaz, navegación y cuerpo de texto. Ninguna otra tipografía dentro del sistema.
Sistema de jerarquía con la nomenclatura del manual: Kicker para etiquetas de sección, Título 1–4 para encabezados, Body para cuerpo y Caption para metadatos.
Los números destacados usan Fraunces. Funcionan bien tanto para datos sueltos como para porcentajes, ratios, fracciones, contadores o formatos compuestos. Siempre acompañados de una etiqueta corta en DM Sans.
Iconos simples, consistentes, escalables y universales. Trazo limpio, sin relleno, todos del mismo grosor. La librería oficial es Lucide — sin emoji, sin iconos de otra biblioteca, sin pictogramas customizados puntuales que rompan el sistema.
Trazo limpio, sin relleno, sin sombras. La función prevalece sobre el estilo decorativo.
Todos de la misma biblioteca (Lucide), mismo grosor de trazo (1.5–2px), mismo radio.
SVG vectorial. Funcionan a 16px en una etiqueta tanto como a 80px en un hero.
Símbolos reconocibles globalmente. Si un icono necesita explicación, no es buen icono.
Selección habitual del sistema Arbitrade. La librería completa de Lucide está disponible en lucide.dev/icons.
Cuatro escalas según contexto. El grosor de trazo se mantiene constante.
Cálida, luminosa, de bajo contraste. Luz natural, tonos tierra, madera, lino. El color de marca aparece como punto de atención dentro de entornos neutros suaves. Sin filtros duros, sin saturaciones agresivas.
Producto en contexto real (oficina, hogar, café), gestos naturales, luz natural suave. El color de marca brilla puntualmente sobre entornos neutros.
Luz natural suave (mañana), tonos cálidos (madera, lino, cream), bajo contraste, producto en contexto real, gestos espontáneos, manos. Focal 50 mm, profundidad de campo corta. Saturación baja, naranja Arbitrade como acento puntual.
Stock genérico de oficina, sonrisas forzadas, luz fría/azulada, filtros duros, alta saturación, contraluces fuertes, renders aislados sin contexto, fondos sobrecargados, expresiones serias o vacías.
Cuatro patrones que rompen la marca. Aunque el producto sea Arbitrade, estas imágenes no lo son.
Producto sin contexto
Contraluz / oscuridad
Render frío / oscuro
Expresión apagada
Referencia para sesiones fotográficas: más expresión, dinamismo, vitalidad. Énfasis en los momentos compartidos y el disfrute. Cara, cuerpo y gesto cuentan tanto como el producto.
Segundo tipo de imagen para banners, stoppers en máquinas y publicidad de marcas concretas. El protagonista es el producto: contextualizado solo con degradados, tipografía e iconos de marca. El objetivo es hacerlo deseable y llamativo.
El producto físico en su entorno real: oficinas luminosas, espacios contemporáneos, integrado en el día a día de las personas. La fotografía termina donde la pieza vive.
Cómo presentamos Arbitrade junto a otras marcas: aliados, proveedores premium, colaboraciones puntuales. Una construcción equilibrada donde ninguna marca domina visualmente.
Las dos marcas se presentan al mismo tamaño óptico. No se mide en píxeles literales sino en presencia: una marca con logotipo ancho ocupará más anchura que un símbolo, pero ambas deben sentirse igual de protagonistas.
El separador es una X en Fraunces, en tono cream-500. Su altura coincide con la altura óptica de las marcas. Conecta sin restar protagonismo.
Mínimo 2× la altura del logotipo entre cada marca y la X. Sin tocarse, sin solaparse, sin elementos decorativos en medio.
El cobranding se presenta sobre cream o blanco. Nunca sobre gradientes de marca propios — el gradiente Arbitrade es de Arbitrade, no del aliado.
Dos colaboraciones reales aplicando las reglas anteriores. Los logos de los aliados se mantienen sin alteraciones — solo la posición y la escala se ajustan al sistema Arbitrade.
Las piezas que el usuario realmente toca. Orden de aparición pensado en cómo se construye una interfaz: primero las acciones, luego la información, luego la entrada de datos y los contenedores, y al final los tokens visuales (radios, sombras y movimiento) sobre los que se apoyan todos los anteriores.
Lo primero que ve y lo único que va a pulsar. Botones principales para acciones decisivas, secundarios para opciones complementarias, fantasma para anulaciones y enlaces para navegación inline. Una sola acción principal por pantalla.
Forma redondeada (píldora). El principal lleva la sombra de marca y atrae la atención. El hover pasa siempre a orange-600 sin escalado. Estados de foco visibles, accesibles por teclado.
Comunican estado, categoría o destacado sin requerir interacción. Pequeñas, cargadas de significado: usar una sola por bloque, dos como máximo si es indispensable distinguir dimensión y atributo.
Tres familias: estado (Nuevo, Beta, Borrador, Premium) en versiones neutrales/de marca; categoría de producto con punto de color al inicio.
Donde el usuario aporta información: contacto, búsqueda, formularios. Sin decoración: solo borde, espacio y un anillo de foco claro para guiar el avance.
Borde cream-300, anillo de foco naranja al 15% de opacidad, radio medio. Sin fondos de color. El placeholder orienta, no sustituye al label.
Pasamos de cajas protagonistas a sistemas más ligeros y humanos, donde el contenido respira y la información acompaña sin robar atención. Los contenedores se vuelven sutiles: líneas simples que ordenan, enmarcan y dan contexto sin imponerse sobre la imagen o el mensaje. Cuando la composición funciona por sí sola, desaparecen.
Coffee corners, micromarkets y vending diseñados para que tu equipo encuentre lo que necesita justo cuando lo necesita. Sin barreras, sin esperas.
Una solución modular que crece con tu empresa: desde un corner exprés hasta un smart-shop 24/7. Tú decides el ritmo, nosotros construimos la experiencia.
Café con avellanas, recién hecho, en tu corner. Pequeños rituales que cambian la jornada.
Snacks dulces con cacao de origen y formatos individuales. Los pequeños placeres que sostienen la jornada.
Especialidad y blends seleccionados, molido en máquina o monodosis. Trazabilidad desde el origen hasta el coffee corner.
Más que un elemento visual, las cajas son una herramienta flexible para aportar claridad. Cuando la composición funciona por sí sola, mejor sin caja.
Cómo responden los componentes a la interacción del usuario. El movimiento no decora: confirma, guía o jerarquiza. Suave, líquido, refinado. Sin rebotes, sin resortes agresivos.
La base técnica sobre la que se apoyan todos los componentes anteriores. Referencia para construir piezas nuevas que se sientan consistentes con el sistema. Radios generosos y sombras con tinte marrón cálido — nunca negro puro.
La máquina es el principal punto de contacto físico con el cliente final. Dos planos distintos: cómo se personaliza una máquina como soporte de marca y cómo se fotografía o renderiza esa máquina cuando aparece en comunicación.
Sistema visual canónico para vinilar y rotular cualquier máquina del parque. El gradiente Dark + Brand domina la chapa: el oscuro neutral abarca la mayor parte de la superficie, integrándose con la máquina, y el naranja aparece como acento puntual en cabecera y detalles tipográficos.
Cabecera Dark + Brand · wordmark en blanco · localización en peso ligero.
Composición vertical · isotipo central · mensaje breve "Una pausa agradable" lateral.
Frontal y lateral rotulado · gradiente vitalidad para categoría snacks · iconografía Lucide.
Cómo fotografiamos o renderizamos las máquinas cuando aparecen en comunicación. Producto en su entorno real (oficina, hall, espacio común), luz natural cálida, gente alrededor cuando aporta — el objetivo es que la máquina se sienta integrada en el día a día, no como un objeto aislado.
El sistema llevado a las piezas que producimos a diario: comunicación promocional, presencia en redes sociales y presentaciones comerciales. Tres bloques con sus propias reglas, todos hablando el mismo idioma de marca.
Piezas para captar la atención del cliente final en el punto de venta y en otras superficies: cartelería, stoppers, banderolas y las pantallas táctiles de las propias máquinas. El protagonista es el producto + un mensaje corto en mayúsculas espaciadas o en Fraunces.
Layout estrella para piezas digitales y signage pequeño. Gradiente de categoría, producto en primer plano, mensaje editorial breve.
Carteles A3/A4 y stoppers para colocar junto al punto de venta. Mensaje muy breve, una imagen y un detalle de marca (logo o pildora de color). Lo trabajamos en próximas iteraciones.
Pantallas de las máquinas vending y café corners. Tipografía DM Sans para UI clara, iconografía Lucide a 24/40 px, naranja de marca para acciones y categorías con sus colores correspondientes. Pendiente de definir.
Composiciones cuadradas o verticales. Producto en mano, mensaje editorial breve, mayúsculas espaciadas como motivo. El toque de marca aparece como pildora de color, círculo del isotipo o gradiente sutil al fondo.
Plantilla de presentaciones para reuniones comerciales y RFPs. Sistema de 6 layouts (portada, sección, datos, cita, productos, cierre) con alternancia de fondos cream / categoría cada 2-3 diapositivas para crear ritmo. Los datos destacados van en Fraunces a tamaño grande.
Lo necesario para producir piezas alineadas con el sistema: el manual completo, logos, fuentes, tokens CSS y el contexto para asistentes de IA.
Documento oficial completo · Pilares, voz, color, tipografía, fotografía, aplicaciones
SVG vectorial · Para web y print
SVG vectorial · Para tamaños pequeños y aplicaciones gráficas
Display typeface · opsz, SOFT, WONK axes
Body & UI typeface · Pesos 100–1000
Sistema completo de variables · Colores, tipografía, espaciado, sombras
Pegar como contexto a Claude u otros asistentes para que generen piezas on-brand