Editor de Wix: agregar fondos de color y gradientes a los elementos
5 min de lectura
Crea fondos hermosos y llamativos para tus elementos con colores sólidos, gradientes o gradientes fluidos.
En este artículo, obtén más información sobre cómo:
Importante:
Actualmente, los gradientes solo están disponibles para agregar como fondo a los siguientes elementos:
- Franjas y columnas
- Presentaciones de diapositivas
- Repetidores
- Menús móviles
- Ventanas interactivas
Agregar un color sólido al fondo
Aplica un solo color al fondo. Elige entre los colores del tema de tu sitio, tus colores guardados o agrega uno nuevo.
Para cambiar el color del fondo:
- Selecciona el elemento correspondiente en el Editor.
- Selecciona Cambiar fondo.
- Selecciona Color.
- Selecciona el icono Color en la parte superior del selector de color y elije una de las siguientes opciones:
- Colores del tema: estos son los colores utilizados en el tema del sitio que se pueden aplicar automáticamente a los elementos del sitio. Selecciona un color en Colores del tema para aplicarlo al fondo. También puedes editar los colores del tema al seleccionar Editar en la parte superior derecha del panel. Más información
- Mis colores: estos son los colores que has agregado y guardado previamente en el sitio. Selecciona un color debajo de Mis colores para aplicarlo al fondo.
- Elegir un nuevo color: selecciona Agregar para usar un nuevo color. El nuevo color estará disponible en Mis colores para aplicarlo a los elementos del sitio.
Agregar un gradiente al fondo
Los degradados son una forma divertida y emocionante de personalizar los elementos y el sitio. Elige un efecto y ajusta los colores y la opacidad para crear algo llamativo para tus visitantes. Hay 3 tipos de gradientes de fondo:
- Lineal: los colores del degradado están en los extremos opuestos y se fusionan a lo largo de una línea invisible.
- Radial: los colores se rodean entre sí y se fusionan a lo largo de un radio.
- Cónico: los colores en el gradiente tienen una transición que rota alrededor del punto central.
Para agregar y personalizar un gradiente:
- Selecciona el elemento correspondiente en el Editor.
- Selecciona Cambiar fondo.
- Selecciona Color.
- Selecciona el icono Gradiente en la parte superior del selector de color.
- Selecciona el menú desplegable y elige el tipo de gradiente que deseas usar.
- Personaliza el gradiente con las siguientes opciones:
- Lineal:
- Ángulo: elige el ángulo del gradiente.
- Posiciones y distancia de los colores: cambia el orden de los colores, acércalos o aléjalos.
- Ajustar colores y opacidad: cambia el color y aumenta o disminuye la opacidad.
- Agregar un nuevo color: para agregar y ajustar un nuevo color, selecciona cualquier lugar de la barra que no contenga ya un punto de color.
- Radial:
- Punto central: establece el punto central del gradiente.
- Posiciones y distancia de los colores: cambia el orden de los colores, acércalos o aléjalos.
- Ajustar colores y opacidad: cambia el color y aumenta o disminuye la opacidad.
- Agregar un nuevo color: para agregar y ajustar un nuevo color, selecciona cualquier lugar de la barra que no contenga ya un punto de color.
- Cónico:
- Posición y rotación: haz clic y arrastra el círculo interno del punto central para cambiar su posición en el fondo, y haz clic y arrastra el círculo externo para cambiar la rotación de la transición de color.
- Posiciones y distancia de los colores: cambia el orden de los colores, acércalos o aléjalos.
- Ajustar colores y opacidad: cambia el color y aumenta o disminuye la opacidad.
- Agregar un nuevo color: para agregar y ajustar un nuevo color, selecciona cualquier lugar de la barra que no contenga ya un punto de color.
- Lineal:
¿Quieres guardar el gradiente?
Simplemente selecciona Agregar en la parte inferior del panel para guardar el gradiente y usarlo en todo el sitio.
Agregar un gradiente fluido al fondo
Crea un fondo único para tus elementos usando gradientes fluidos. En estos gradientes, hay puntos a lo largo del gradiente con diferentes colores, que puedes fusionar a tu gusto.
Hay ajustes preestablecidos disponibles para cada tipo de gradiente en la parte inferior del panel. Estos gradientes se crean con los colores del sitio y se pueden personalizar.
Para agregar y editar un gradiente fluido:
- Haz clic en el elemento correspondiente en el Editor.
- Haz clic en Cambiar fondo.
- Haz clic en Color.
- Haz clic en el icono Gradiente de fluido en la parte superior del selector de color.
- Personaliza el gradiente con las siguientes opciones:
- Posición: cambia la posición de cada color en el gradiente.
- Ajustar colores y opacidad: cambia el color y usa el control deslizante para aumentar o disminuir la opacidad.
- Tamaño: establece el tamaño de los colores en el gradiente.
- Esparcido: establece cuánto se extiende cada color a través del gradiente.
- Fondo del gradiente: selecciona un color para mostrar detrás del gradiente.
- Agregar un nuevo color: para agregar y ajustar un nuevo color, selecciona cualquier lugar de la vista previa que no contenga ya un punto de color. Consejo: Puedes agregar tantos colores como quieras, no hay límite a la hora de personalizar el gradiente.
¿Quieres guardar tu gradiente fluido?
Simplemente selecciona Agregar en la parte inferior del panel para guardar el gradiente y usarlo en todo el sitio. Puedes aplicar y agregar nuevos gradientes en Mis gradientes fluidos en el panel.
Aplicar gradientes a fondos de video o imágenes
Si tienes una imagen o un fondo de video en tu elemento, también puedes agregar un efecto degradado detrás de él.
Simplemente selecciona un video o una imagen como fondo, y luego ajusta la opacidad del gradiente.
Para aplicar gradientes a un fondo multimedia:
- Haz clic en el elemento correspondiente en el Editor.
- Haz clic en Cambiar fondo.
- Haz clic en Ajustes.
- Selecciona la caja de color junto a Fondo del video/Color detrás de imagen.
- Crea y agrega un gradiente.
- Selecciona la X en la parte superior del selector de color/gradiente para cerrarlo.
- Arrastra el control deslizante debajo de Opacidad de la imagen/Opacidad del video para hacer que el gradiente de fondo sea tan visible como desees.
¿Te ha sido útil?
|