¿Qué es?
Cómo Se Ve es el tab del dashboard donde eliges el aspecto visual de tu página. Aquí seleccionas la paleta de colores que define toda la apariencia de tu landing: botones, fondos, textos y acentos.
¿Dónde lo encuentro?
Dashboard → Cómo Se Ve (tercer ícono en el menú lateral, 🎨)
La pantalla se divide en dos partes:
- Izquierda (principal): Grid de paletas de color disponibles, agrupadas por categoría
- Derecha (lateral): Paleta personalizada (solo plan Visión)
¿Qué hace?
Paletas de color prediseñadas
Hay 30+ paletas organizadas por categoría de negocio:
| Categoría | Paletas incluidas | Ideal para |
|---|
| Clean | Default, Harvest, Ocean, Cashmere | Negocio general, minimalista |
| Fresh | Olive, Retro, Bubblegum | Negocios creativos, juveniles |
| Bold | Autumn | Negocios llamativos |
| Dark | Moon | Negocios premium, elegantes |
| Comida | Sabor Tradicional, Fuego Urbano, Parrilla Moderna, Casa Latina | Restaurantes, areperas, comida |
| Dulces | Rosa Vainilla, Pistacho Suave, Cielo Dulce, Chocolate Caramelo | Pastelerías, dulcerías |
| Salud | Azul Confianza, Verde Calma | Clínicas, consultorios |
| Autoridad | Azul Profesional, Ejecutivo Oscuro, Prestigio Clásico | Abogados, contadores, consultores |
| Oficios | Industrial Pro, Negro Impacto, Metal Urbano | Ferreterías, talleres |
| Belleza | Nude Elegante, Rosa Studio | Peluquerías, salones, spas |
| Fitness | Barber Clásico, Fuerza Roja, Verde Potencia, Azul Eléctrico | Gimnasios, entrenadores |
| Educación | Azul Académico, Verde Progreso, Claro Simple | Academias, tutores |
- Nombre de la paleta
- Franja de 4 colores (primario, variantes claras y oscuras)
- Indicador de selección (borde azul + checkmark)
Seleccionar una paleta
Haz clic en cualquier paleta → se aplica inmediatamente a tu landing. Los 4 colores de la paleta definen las variables CSS --brand-50, --brand-500, --brand-600, --brand-700 que controlan toda la apariencia.
Paleta personalizada (solo Visión)
En el panel derecho, los usuarios del plan Visión pueden crear una paleta completamente personalizada:
- Introduce un color primario en formato hexadecimal (ej:
#FF6B35)
- Haz clic en “Aplicar Paleta Custom”
- El sistema genera automáticamente las 4 variantes (50, 500, 600, 700)
¿Qué NO hace?
- No permite cambiar fuentes tipográficas — se usa la fuente del sistema (Geist)
- No permite editar CSS directamente
- No tiene modo oscuro/claro (la landing siempre usa fondo blanco)
- No permite colores distintos por sección
- No guarda historial de paletas anteriores
Disponibilidad por plan
| Característica | Oportunidad | Crecimiento | Visión |
|---|
| Paletas disponibles | 10 | 17 | 17 |
| Paleta personalizada | ❌ | ❌ | ✅ |
| Categorías visibles | Limitadas | Todas | Todas |
En el plan Oportunidad, no todas las categorías de paletas están disponibles. Por ejemplo, las paletas de categorías como Dark, Autoridad o Fitness pueden requerir plan Crecimiento o superior.
Ejemplo práctico
Caso: Gym “Iron Power” en Puerto La Cruz
Diego tiene un gimnasio. Va a Cómo Se Ve y ve las paletas organizadas por categoría:
- Baja hasta la categoría Fitness
- Ve las opciones: Fuerza Roja, Verde Potencia, Azul Eléctrico
- Hace clic en “Fuerza Roja” — su landing cambia a tonos rojos intensos
- Prueba “Azul Eléctrico” — le gusta más
- Cierra el dashboard → su página queda con la paleta Azul Eléctrico
Si Diego tuviera el plan Visión, podría ir al panel derecho, escribir #FF4500 (naranja intenso) y crear una paleta propia que nadie más tiene.
