Define tu Identidad de Marca: Colores Mágicos y Personalización

 

En este tutorial aprenderás a dar personalidad a tu sitio web, ya sea eligiendo cada color manualmente o dejando que nuestra herramienta de "Colores Mágicos" (Magic Colors) haga el trabajo creativo por ti.

 

 

Paso 1: Ingresar al Editor de Colores

 

  1. Abre el Editor Visual de tu tienda.

  2. En el menú principal de la barra lateral izquierda, busca el botón "Paleta de colores" (o regresa al menú principal con la flecha "Volver" si estás editando un componente).

  3. Aquí verás todas las herramientas de diseño visual.

 

 

Paso 2: Usar Magic Colors (Generación con IA)

 

Si no eres diseñador, esta es la mejor opción. Magic Colors crea combinaciones profesionales basadas en una descripción.

  1. Haz clic en el botón "Colores mágicos" (o el icono de la varita mágica ✨).

  2. Se abrirá una ventana emergente. En el cuadro de texto, describe tu marca.

    • Ejemplo: "Tienda de ropa infantil, colores pasteles, suave y alegre".

    • Ejemplo: "Venta de herramientas industriales, colores fuertes, negro y amarillo, moderno".

  3. Presiona "Generar" y espera unos segundos.

  4. El sistema te mostrará varias propuestas de paletas. Haz clic sobre ellas para probarlas en tiempo real en tu página.

  5. ¡Elige la que más te guste!

 

 

 

Paso 3: Paletas Predefinidas

 

Si prefieres algo rápido y probado, Flobu ofrece combinaciones listas para usar.

  1. En la sección "Colores disponibles", verás una lista de barras de colores.

  2. Cada barra representa un tema completo (Fondo, Texto, Primario, Secundario).

  3. Haz clic en cualquiera para aplicarlo instantáneamente a toda tu tienda.

 

 

 

Paso 4: Ajuste Manual (Colores Personalizados)

 

Para los usuarios avanzados que ya tienen sus códigos de color corporativos:

  1. Baja a la sección "Colores personalizados".

  2. Aquí puedes definir con precisión cada elemento:

    • Color del cuerpo: El fondo general de la página.

    • Color primario: Botones principales y destacados.

    • Color secundario: Elementos de contraste.

    • Color del texto: Títulos y párrafos.

  3. Haz clic en el círculo de color para abrir el selector o pegar tu código Hexadecimal (ej: #FF5733).