Saltar al contenido
pando/ docs

Marca e identidad

La identidad visual v1 de Pando: el símbolo, la paleta, la tipografía y dónde aparece cada uno en la aplicación. Esta página es para quien escriba documentación, prepare una captura de pantalla, contribuya con un cambio de interfaz, o empaquete Pando para una nueva plataforma y necesite el recurso correcto.

El símbolo — 木

La marca es 木, el carácter chino/japonés para “árbol”: dos trazos curvos sobre un tronco, más tres pequeños nodos de circuito entrelazados en las ramas. La idea detrás — una raíz, muchos agentes — es literal: una sola instancia de Pando, muchos subagentes ramificándose desde ella.

Los trazos son monolínea (grosor constante, extremos y uniones redondeados) para que la marca se mantenga legible desde un favicon de 16px hasta un lockup de logotipo completo.

Paleta

MuestraNombreHexUso
Bosque#0F2A20Fondo de marca / tinta — el verde oscuro sobre el que se apoya cada marca, y el color del trazo sobre fondos claros
Marfil#F4F1E8El color del trazo sobre fondos oscuros — blanco cálido, nunca blanco puro
Álamo#E9B949Acento — los nodos de circuito y resaltados solo sobre fondos oscuros
Álamo oscuro#C68A17Acento — nodos y marcas pequeñas solo sobre fondos claros
Álamo oscuro es para marcas, no para texto. #C68A17 sobre Marfil o blanco da un contraste de ~2,6:1 — no pasa WCAG AA para cuerpo de texto, etiquetas o botones. Úsalo solo para los puntos de los nodos de circuito y pequeños acentos de marca. Cuando el WebUI necesita un color de acento accesible para texto y controles en modo claro, calcula en su lugar un #8f6310 más oscuro — ver Dónde aparece la marca en Pando más abajo.

Tipografía

  • Space Grotesk, pesos 500–600, para el logotipo y los titulares. En los ficheros del logo el logotipo ya está convertido a trazados, así que se renderiza correctamente incluso donde la fuente no está instalada.
  • JetBrains Mono para la TUI, ejemplos de código y cualquier etiqueta monoespaciada.

La familia de símbolos

La marca de Pando es la raíz de una pequeña familia. Cada sección mantiene el mismo sistema — trazos monolínea en Marfil o Bosque, nodos de circuito con el color de acento — con su propio carácter representando lo que hace esa sección:

SecciónCarácterIdeaMarca (fondo claro / fondo oscuro)
Pando木 — árbolUna raíz, muchos troncosMarca PandoMarca Pando
Remembrances本 — raíz / libroEl trazo dorado en la raíz es la memoria guardadaMarca RemembrancesMarca Remembrances
Mesnada众 — multitud / séquitoEl señor como nodo macizo, su mesnada como el anillo a su alrededorMarca MesnadaMarca Mesnada
Icono Pando
Pando 木
Icono Remembrances
Remembrances 本
Icono Mesnada
Mesnada 众

Logotipos

El logotipo completo combina la marca con el logotipo en Space Grotesk. Hay dos variantes de color — elige la que corresponda al color del fondo, no de la marca en sí:

Logo Pando, tinta oscura Logo Pando, tinta clara

  • pando-logo-dark.svg — trazos color Bosque, para fondos claros.
  • pando-logo-light.svg — trazos color Marfil, para fondos oscuros.

Sí, el nombre es contraintuitivo a primera vista: el sufijo nombra el color de la tinta, no del fondo. -dark es tinta oscura (se usa sobre fondos claros), -light es tinta clara (se usa sobre fondos oscuros).

Recursos

Todos los ficheros fuente viven en assets/pando-brand-v1/ dentro del repositorio principal de pando — esa carpeta es la fuente de verdad única. Los ficheros más habituales también están publicados aquí para descarga directa:

FicheroUso
pando-logo-dark.svgLogotipo completo (marca + wordmark), tinta oscura, para fondos claros
pando-logo-light.svgLogotipo completo, tinta clara, para fondos oscuros
pando-mark-dark.svgSolo el símbolo, tinta oscura, para fondos claros
pando-mark-light.svgSolo el símbolo, tinta clara, para fondos oscuros
pando-icon.svgIcono de app — marca sobre una tesela Bosque, autocontenido (funciona sobre cualquier fondo)
pando-icon-256.pngIcono de app, ráster 256×256
remembrances-mark-dark.svg / -light.svgSímbolo Remembrances 本, tinta oscura / clara
remembrances-icon.svgIcono de app/sección de Remembrances
mesnada-mark-dark.svg / -light.svgSímbolo Mesnada 众, tinta oscura / clara
mesnada-icon.svgIcono de app/sección de Mesnada

Formatos adicionales (.ico de Windows, .icns de macOS, variantes monocromas, y la escalera completa de PNG de 16px a 1024px) viven junto a los SVG en el repositorio fuente.

Dónde aparece la marca en Pando

  • WebUI — la marca 木 aparece en la barra de título junto a “Pando” (pulsa mientras un agente trabaja) y en la pantalla de bienvenida. La familia de tema pando en Configuración → Apariencia se deriva directamente de esta paleta: el modo oscuro usa fondos Bosque, texto Marfil y Álamo como acento; el modo claro usa un fondo con tinte Marfil y el acento oscurecido #8f6310 para cumplir el contraste AA. Es una de cuatro familias (pando, paper, slate, forest), cada una disponible en claro/oscuro con un color de acento a elegir.
  • Aplicación de escritorio — el icono de la app (.icns en macOS, .ico en Windows) se genera a partir de pando-icon.svg, y el fondo de la ventana coincide con Bosque.
  • TUI — el tema pando aplica la misma paleta Bosque/Marfil/Álamo a la interfaz de terminal. Las secciones de Remembrances y Mesnada en los ajustes y en la cabecera del orquestador usan los glifos 本 y 众 en el color de acento, y la animación de arranque/ocupado recorre 枝葉林森 (rama, hoja, bosque, arboleda — caracteres todos relacionados con árboles).
  • Mesnada UI (la interfaz independiente del orquestador) — usa la marca de Mesnada como favicon.

Contribuir

Si añades una nueva superficie de interfaz o empaquetas Pando en un sitio nuevo, reutiliza los SVG de assets/pando-brand-v1/ en lugar de redibujar la marca — el grosor de los trazos y la posición de los nodos están ajustados para seguir siendo legibles a tamaños pequeños, y redibujar tiende a desviarse del original. Si necesitas un tamaño, formato o variante de color que no existe todavía, abre un issue o una PR en el repositorio de pando.