BioTech Innovation Platform

Brandbook visual · Estilo Gemini / CrossingOver LATAM

v2.0 — Audited & refined

Theme:
01

Paleta de Colores

Nota de auditoría: Se eliminó el negro puro (#0a0a0f) del fondo base. Ahora es #0f0f14 — gris antracita profundo que mantiene la elegancia oscura sin aplastar el contraste. Las cards usan #181820, lo suficientemente claro para separarse del fondo sin parecer blancas.

Gradiente principal

Turquesa → Violeta → Rosa · Solo para H1 hero, CTAs y highlights de scoring

Primarios

Primary #00d4aa Turquesa — el "cruce"
Secondary #6c5ce7 Violeta — puente ciencia/negocio
Accent Pink #fd79a8 Energía disruptiva

Fondos

Fondo Base (Dark) #0f0f14 Gris antracita — no negro puro
Fondo Card (Dark) #181820 Suficiente contraste con base

Contraste de fondo

Fondo Light #f5f5f7
Card Light #ffffff

Arquetipo por color

Industry#0984e3
Startup#fd79a8
Research#00b894
VC#fdcb6e
Policy#e17055
02

Dark & Contraste — Auditoría v2

Problema identificado: El fondo negro puro (#0a0a0f) aplastaba las cards y creaba contraste excesivo. Se reemplazó por #0f0f14 (gris antracita) que mantiene la elegancia oscura sin fatigar la vista ni hacer que los elementos no se distingan.

Contraste Base → Card

Elemento Color Estado
Fondo Base (v1) #0a0a0f ✗ Negro puro, aplasta
Fondo Base (v2) #0f0f14 ✓ Gris antracita, elegantes
Card (v1) #131318 ✗ Muy cerca de base
Card (v2) #181820 ✓ Separación clara
Card hover (v2) #1e1e28 ✓ Interacción visible

Comparación visual

Dark mode v2

Phage therapy

Bacteriófagos vs antibióticos

9.1
Light mode

Phage therapy

Bacteriófagos vs antibióticos

9.1
03

Gemini-style Icons

Inspirados en los app icons de Google Gemini: gradiente suave de fondo, ícono blanco SVG inline, esquinas redondeadas, estilo "cristal".

Principio de diseño

Estructura

Fondo con gradiente (2 stops) + ícono SVG blanco al centro + border-radius alto

Reglas

Máximo 2 colores en el gradiente. SVG blanco puro. Border-radius: 25% del tamaño del ícono.

Íconos de arquetipo

Industry
Confianza corporativa
Startup
Energía disruptiva
Research
Rigor científico
VC
Señal de inversión
Policy
Guardian / alerta

Íconos de feedback/reacción

💡 Útil
✅ Validar
❓ Aclarar
🤝 Collab
⚠️ Riesgo

SVG paths — copiar/pegar

🏭 Industry / Fábrica
<svg viewBox="0 0 24 24"> <path d="M22 22H2V10l7-3v3l7-3v3l7-3v15z M4 12v8h6v-6l4 2v4h5V10l-5 2 V9l-4 2-4-2v3z"/> </svg>
🚀 Startup / Energía
<svg viewBox="0 0 24 24"> <path d="M13 3L3 14h6l-1 5 10-11h-6l1-5z"/> </svg>
🔬 Research / Microscopio
<svg viewBox="0 0 24 24"> <path d="M15 4s-1 0-1 1v3a3 3 0 0 0 3 3h0 a3 3 0 0 0 3-3V5c0-1-1-1-1-1H15z M8 11a7 7 0 0 0 7 7h0a7 7 0 0 0 7-7v-3 a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v3 a7 7 0 0 0 4 6zM10 20l2 2 2-2"/> </svg>
💰 VC / Moneda
<svg viewBox="0 0 24 24"> <path d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2z M12 2a8 8 0 1 1-8 8 8 8 0 0 1 8-8z M12 5a3.5 3.5 0 1 0 3.5 3.5A3.5 3.5 0 0 0 12 7z M12 10a3 3 0 1 0 3 3 3 3 0 0 0-3-3z"/> </svg>
⚖️ Policy / Escudo
<svg viewBox="0 0 24 24"> <path d="M12 2L3 7v6c0 5.5 3.8 10.7 9 12 5.2-1.3 9-6.5 9-12V7l-9-5z M9 18V9l6 4.5L9 18z"/> </svg>
💡 Útil / Bombilla
<svg viewBox="0 0 24 24"> <path d="M9 21c0 .5.4 1 1 1h4c.6 0 1-.5 1-1v-1H9v1z M12 2C8.1 2 5 5.1 5 9c0 2.3 1.2 4.3 3 5.6V17h8v-2.4 c1.8-1.3 3-3.3 3-5.6 0-4-3.1-7-7-7z M14.8 14.8A1 1 0 0 1 14 15h-4a1 1 0 0 1-.8-1.2 A1 1 0 0 1 10 13h4a1 1 0 0 1 .8 1.8z"/> </svg>

Reglas de uso

✅ Usar

Gradiente suave (2 stops), esquinas redondeadas, ícono blanco SVG inline, tamaño proporcional

❌ No usar

Emojis en UI productiva, gradientes con +2 colores, bordes afilados, íconos oscuros

04

Cards & Elementos UI

Challenge card con Gemini icon

Phage therapy platform
Bacteriófagos como alternativa a antibióticos resistentes
9.1
Algae carbon capture
Microalgas para capturar CO2 industrial a escala
7.2

Tags

Research Industry Startup VC Policy
05

Tipografía

Font stack

System font stack

-apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif

Hierarquía

H1 · 28-36px · 800 · Gradient
De la Duda al Avance
H2 · 22-28px · 700
Feedback del ecosistema
Body · 14-15px · 400
Publicá un desafío, aclará el dolor, recibí feedback — asíncrono.
07

Personalidad de Marca

Prompt de personalidad: Un científico de CONICET y un founder de Luyef charlando después de una charla de CrossingOver, y quisiéramos seguir conversando.

Cómo es la marca

💡 Profunda
Inteligente pero accesible. Explicamos la ciencia sin perder el rigor.
No es: Academismo estéril
⚡ Energética
Vibrante como LATAM. Energía que impulsa, no hype vacío.
No es: Hype vacío
🤝 Conectada
Pone personas en el centro. Conexión real, no red social fría.
No es: Red social fría
🔬 Confiable
Basada en rigor científico. Credibilidad sobre velocidad.
No es: Startup bro

Tono de voz

✅ ES

"Publicá un desafío. Recibí feedback. Encontrá collaboraciones."

"El problema que sentís que nadie resolvió todavía"

"¿Querés que este experto lo vea?"

❌ NO ES

"Descubrí oportunidades de sinergia mediante nuestra plataforma de conexión de stakeholders"

"La brecha no resuelta en la cadena de valor actual"

"¿Desea solicitar la atención de un especialista?"

Palabras que usamos

Desafío Dolor Feedback Collab Ecosistema Conectar Validar Bio Biotech Score Claridad Rigor Impacto Track Signal

Palabras que evitamos

Synergy Leverage Stakeholders Paradigma Disrupción Thought-leadership End-to-end Holísticas
08

Aplicaciones Reales

Nota de auditoría: Se agregó esta sección para mostrar la paleta aplicada a contextos reales de la plataforma. Sin esto, el brandbook es solo una lista de colores sin contexto.

Landing / Web

Hero Section

Fondo oscuro (#0f0f14) + H1 con gradiente + 2 CTAs + cards de features con bordes sutiles

Gradient en H1 Cards #181820 Mobile first

Dashboard (dentro de la plataforma)

Challenge Feed

Cards con Gemini icons de arquetipo + scores coloridos + hover states con elevación

Phage therapy platform
Bacteriófagos como alternativa a antibióticos
9.1
Scores visibles Gemini icons Hover #1e1e28

Presentaciones / Decks

Slide Deck

Fondo oscuro, gradientes solo en títulos y slides de cierre, una idea por slide, data visual limpia con colores de arquetipo

Gradiente solo en H1 Una idea/slide Data visual limpia

Social media / Cards para compartir

Social Card

Fondo oscuro, texto blanco, quote o dato clave en grande, tags de arquetipo en la esquina, logo XO pequeño abajo a la derecha

Dark BG Quote grande Logo XO
09

Do / Don't — Reglas visuales

Gradientes

✅ Usar
  • H1 hero y secciones principales
  • Botones primarios CTA
  • Highlights de scoring
  • Gradiente principal (solo 3 stops)
❌ No usar
  • Fondos completos
  • Bordes
  • Íconos
  • Textos secundarios
  • Más de 3 colores

Icons

✅ Usar
  • Gemini-style con gradiente suave
  • SVG blanco inline
  • Borders-radius 25% del tamaño
  • Tamaño proporcional al contexto
❌ No usar
  • Emojis en UI productiva
  • Gradientes con +2 colores
  • Bordes afilados
  • Íconos oscuros sobre fondo oscuro

Dark mode

✅ Usar
  • Fondo base: #0f0f14 (gris antracita)
  • Cards: #181820 (suficiente contraste)
  • Bordes: #2a2a3e (sutiles pero visibles)
  • Texto dim: #8888aa (legible sin brillo)
❌ No usar
  • Negro puro #000000 (fatiga visual)
  • #0a0a0f (aplasta el contraste)
  • Texto blanco puro sobre fondo oscuro (brillo excesivo)
  • Sombras blancas (no tienen sentido en dark)

Cards y contenedores

✅ Usar
  • Border radius: 12px (consistencia visual)
  • Padding: 16px mínimo
  • Bordes sutiles: 1px
  • Elevación al hover: #1e1e28
❌ No usar
  • Border radius 0 (cuadrados duros)
  • Sombras (no tienen lugar en dark mode)
  • Gradientes de fondo en cards
  • Más de 2 niveles de profundidad
BioTech Innovation Platform · Brandbook Visual v2 · Audited & refined