Editor de Wix: usar y personalizar un tema de color

5 min de lectura
Crear un tema de color es un paso importante en el proceso de diseño de tu sitio. Cuando se usan de manera consistente, los temas de color marcan la pauta para los visitantes y les presentan tu marca. 
El tema de color se utiliza automáticamente en todo el sitio y elementos "temáticos" en el panel Agregar. También puedes aplicar los colores de tema a cualquier elemento del sitio.
En este artículo, obtén más información sobre lo siguiente:

Cómo funcionan los temas de color en el sitio

Los temas de color que eliges se muestran en el selector de color, donde puedes cambiar el color de los elementos individualmente. Además de aparecer en el selector, los colores también se delegan y se aplican automáticamente a ciertos elementos del sitio.

Colores base

Los colores base se utilizan para los fondos y el texto en todo el sitio. Si has agregado apps de Wix (por ejemplo, Wix Stores, Wix Blog, etc.) a tu sitio, esas páginas usan los mismos colores de fondo y de texto. 
En la mayoría de los casos, el color más brillante (1) se utiliza para el fondo, mientras que el más oscuro (2) se destina para el texto. Se crea automáticamente un degradado para que puedas ajustar las sombras según sea necesario. 
Recomendamos seleccionar un emparejamiento de alto contraste, para que la información del sitio resulte fácil de leer.
Captura de pantalla recortada que muestra los colores base en un panel de diseño del sitio.

Colores de énfasis

Anima a los visitantes a interactuar con tu sitio seleccionando colores de énfasis llamativos. Estos colores se utilizan para elementos secundarios y decorativos, como enlaces, botones y elementos de menú. También aparecen en elementos temáticos, como botones y cajas, así como en páginas relacionadas con las apps de Wix (por ejemplo, Wix Stores, Wix Blog, etc.)
Captura de pantalla recortada que muestra los colores de acento en un panel de diseño del sitio.

Elegir un tema de color

Hay una variedad de temas preestablecidos disponibles para que los apliques al sitio, que incluyen texto como colores. Nuestros temas se han creado cuidadosamente con colores complementarios para cubrir una amplia gama de estilos y necesidades de diseño.  

Para elegir y personalizar un tema de color:

  1. Selecciona Diseño del sitio  a la izquierda del editor.
  2. Haz clic en Cambiar tema dentro de Tema del sitio.
  3. Navega por los ajustes preestablecidos y haz clic para seleccionar uno nuevo. 
El panel de diseño del sitio en el editor. La pestaña del tema está abierta y se está seleccionando un tema.

Personalizar el tema de color

Puedes personalizar el tema de color del sitio para que coincida con la estética de tu marca. Elige nuevos colores y ajusta el tono de los colores base para obtener el aspecto que realmente deseas.

Para personalizar el tema de color:

  1. Selecciona Diseño del sitio  a la izquierda del editor.
  2. Haz clic en Tema de color en Personaliza el diseño de tu sitio.
  3. Elige cómo quieres cambiar el tema:
    • Cambia los colores del tema:
      1. Haz clic en el color que deseas editar en el panel.
      2. Selecciona un nuevo color usando el cursor para buscar y seleccionar un nuevo color, o ingresando el color exacto en valores HEX, RGB o HSB.
      3. Haz clic en Aplicar.
    • Ajusta el tono de los colores base del tema:
      1. Haz clic en el tono correspondiente en el degradado de color base.
      2. Usa los controles deslizantes para ajustar la saturación y el brillo a tu gusto.
      3. Haz clic en Aplicar.
El panel Personalizar tema de color en Diseño del sitio. Se está aplicando un nuevo color de énfasis.

Establecer colores predeterminados para el sitio

Después de elegir y personalizar el tema de color, puedes establecer los colores del tema como los predeterminados para ciertos elementos del sitio. Esta es una excelente manera de reforzar tu imagen de marca y garantizar que los elementos se complementen entre sí.

Para establecer los colores predeterminados para los elementos:

  1. Selecciona Diseño del sitio  a la izquierda del editor.
  2. Pasa el cursor sobre Tema de color y Tema de texto y haz clic en Personalizar.
  3. Haz clic en Ajustes avanzados.
  4. Haz clic en el cuadro de color junto al elemento correspondiente para asignarle un color:
    • General: elige los colores que deseas usar para los fondos principales y secundarios del sitio, así como para las líneas y los separadores.
    • Texto: aplica los colores elegidos a diferentes tipos de texto en el sitio, incluidos los subtítulos y los enlaces.
    • Botones: establece los colores que deseas usar en los botones primarios y secundarios. Puedes elegir un color para cada estado del botón (normal, al pasar el cursor o desactivado) por separado.
Los ajustes avanzados de un tema de color. Se está haciendo clic en el cuadro de color para las líneas y los separadores.

Aplicar manualmente los colores del tema a los elementos

Puedes aplicar los colores del tema a cualquier elemento adicional del sitio. Se guardan en el selector de color del panel de diseño del elemento, por lo que es aún más fácil crear un diseño uniforme.

Para aplicar un color del tema a un elemento:

  1. Selecciona el elemento en el editor.
  2. Haz clic en el icono Diseño .
  3. Haz clic en Personalizar (si se muestra).
  4. Haz clic en Ajustes de color.
  5. Haz clic en el cuadro de color.
  6. Selecciona un color del tema en el selector.
El panel Diseño de una sección. Se está aplicando un color del tema al fondo de la sección.
Consejo:
También puedes guardar colores personalizados que no forman parte del tema en el selector de colores. Selecciona + Agregar junto a Mis colores para seleccionar un nuevo color.
Además, los elementos temáticos dentro del panel Agregar en el editor, ya cuentan con los colores del tema (por ejemplo, botones temáticos, cajas y líneas), por lo que no tienes que preocuparte por ajustarlos manualmente para que coincidan con el sitio.  

¿Te ha sido útil?

|