Branding¶
Personaliza la apariencia de Nexus con la identidad visual de tu organización.
¿Qué puedes personalizar?¶
| Elemento | Descripción |
|---|---|
| Logo | Imagen de la organización |
| Colores | Esquema de colores principal |
| Favicon | Icono en pestañas del navegador |
| Nombre | Cómo aparece tu organización |
Acceder a branding¶
- Ve a Configuración > Organización
- Pestaña Branding
Configuración de logo¶
┌─────────────────────────────────────────────────────────────────┐
│ Logo de la organización │
├─────────────────────────────────────────────────────────────────┤
│ │
│ ┌─────────────────────┐ │
│ │ │ │
│ │ [Logo actual] │ │
│ │ │ │
│ └─────────────────────┘ │
│ │
│ [Subir nuevo] [Eliminar] │
│ │
│ Requisitos: │
│ • Formato: PNG, JPG, SVG │
│ • Tamaño máximo: 2 MB │
│ • Dimensiones recomendadas: 200x50 px │
│ │
└─────────────────────────────────────────────────────────────────┘
Logo claro y oscuro¶
Puedes subir versiones diferentes:
┌─────────────────────────────────────────────────────────────────┐
│ Variantes del logo │
├─────────────────────────────────────────────────────────────────┤
│ │
│ Tema claro │ Tema oscuro │
│ ┌─────────────────────┐ │ ┌─────────────────────┐ │
│ │ [Logo negro] │ │ │ [Logo blanco] │ │
│ └─────────────────────┘ │ └─────────────────────┘ │
│ [Cambiar] │ [Cambiar] │
│ │
└─────────────────────────────────────────────────────────────────┘
Colores personalizados¶
Configura el esquema de colores:
┌─────────────────────────────────────────────────────────────────┐
│ Colores │
├─────────────────────────────────────────────────────────────────┤
│ │
│ Color primario │
│ ┌─────┐ ┌─────────────────────────────────────────────────────┐│
│ │ 🔵 │ │ #3B82F6 ││
│ └─────┘ └─────────────────────────────────────────────────────┘│
│ │
│ Color secundario │
│ ┌─────┐ ┌─────────────────────────────────────────────────────┐│
│ │ 🟢 │ │ #10B981 ││
│ └─────┘ └─────────────────────────────────────────────────────┘│
│ │
│ Color de acento │
│ ┌─────┐ ┌─────────────────────────────────────────────────────┐│
│ │ 🟣 │ │ #8B5CF6 ││
│ └─────┘ └─────────────────────────────────────────────────────┘│
│ │
│ [Restablecer por defecto] [Guardar] │
│ │
└─────────────────────────────────────────────────────────────────┘
Dónde se aplican los colores¶
| Color | Uso |
|---|---|
| Primario | Botones principales, enlaces, header |
| Secundario | Elementos secundarios, badges |
| Acento | Highlights, notificaciones |
Favicon¶
El favicon aparece en la pestaña del navegador:
┌─────────────────────────────────────────────────────────────────┐
│ Favicon │
├─────────────────────────────────────────────────────────────────┤
│ │
│ ┌─────┐ │
│ │ 🔷 │ Favicon actual │
│ └─────┘ │
│ │
│ [Subir nuevo] │
│ │
│ Requisitos: │
│ • Formato: ICO, PNG │
│ • Tamaño: 32x32 px o 64x64 px │
│ │
└─────────────────────────────────────────────────────────────────┘
Vista previa¶
Antes de guardar, previsualiza los cambios:
┌─────────────────────────────────────────────────────────────────┐
│ Vista previa │
├─────────────────────────────────────────────────────────────────┤
│ │
│ ┌───────────────────────────────────────────────────────────┐ │
│ │ [Logo] Mi Empresa 🔔 👤 │ │
│ ├───────────────────────────────────────────────────────────┤ │
│ │ │ │
│ │ [■ Botón primario] [□ Botón secundario] │ │
│ │ │ │
│ │ Enlace de ejemplo │ │
│ │ │ │
│ └───────────────────────────────────────────────────────────┘ │
│ │
│ Tema: [☀️ Claro] [🌙 Oscuro] │
│ │
└─────────────────────────────────────────────────────────────────┘
Dominio personalizado¶
Enterprise
Disponible en plan Enterprise.
Configura tu propio dominio:
- Contacta a soporte
- Configura DNS CNAME
- Se provisiona SSL automático
Email personalizado¶
Las notificaciones por email pueden usar tu dominio:
Restablecer branding¶
Para volver a los valores por defecto:
- En cada sección, haz clic en Restablecer
- O usa Restablecer todo para eliminar toda personalización
Consideraciones¶
Accesibilidad
Asegúrate de que los colores tienen suficiente contraste para ser legibles.
Consistencia
Usa los mismos colores que tu marca para mejor reconocimiento.
Tamaños de logo
Prueba cómo se ve el logo en diferentes tamaños de pantalla.
Siguiente: Plugins - Extensiones y plugins.