FANDOM


Linear-gradient

Un gradiente lineal

Tener un gradiente en el fondo de tu wiki ayuda a que se visualice correctamente en todos los dispositivos.

¿Qué son los gradientes?

Background gradient step 1

Fondo usado

Los gradientes son suaves transiciones de un color a otro. Existen dos tipos muy útiles: lineales y radiales, el primero hace una transición de un color a otro en una línea, el segundo lo hace formando un círculo, donde el gradiente parte del centro.

Aplicando gradientes

Background gradient step 2

(Paso 1) Nota las transiciones bruscas

Para este tutorial, vamos a estar usando la imagen de la derecha, el conocido fondo de Windows. También necesitarás un programa compatible con gradientes. En este caso, vamos a estar utilizando el programa gratuito GIMP.

Paso 1

Echar un vistazo a la imagen de la derecha, como se puede ver el fondo azul no encaja en absoluto con la imagen de fondo, y no hay en absoluto transición entre los dos. Para solucionar este problema, vamos primero a detectar el color de fondo del wiki. Toma una captura de pantalla de la página en la que te encuentres actualmente y pega (CTRL + V) la imagen en GIMP.

Paso 2

En GIMP, selecciona el "Selector de color" de la caja de herramientas a la izquierda (GIMP color picker). Ahora, haz clic en el color de fondo del wiki (no la imagen de fondo). Ahora tienes el color adecuado para aplicar el gradiente.

Paso 3

A continuación, abre el fondo original en GIMP (el fondo de escritorio de Windows). Elige la herramienta de degradado (GIMP gradient). A continuación, en el menú de la caja de herramientas a la izquierda, selecciona "FG a transparente" en el menú desplegable que aparece al hacer clic en la imagen junto a "Gradiente:" (Gradient image). Ahora podrás aplicar el gradiente.

Paso 4

Background gradient step 3

(Paso 4) Centro, izquierda. Click para agrandar.

Pon el cursor sobre el borde izquierdo de la imagen, en el centro (ver imagen). Ahora mantén presionado el botón del ratón y tira hasta el centro de la imagen, y suelte el botón. Ahora hay un gradiente en la imagen. Haga lo mismo para la parte inferior y la derecha.

Paso 5

Ahora guarda la imagen, (Archivo -> Guardar como...), y guarda la imagen como un archivo .jpg. En el menú de diálogo que aparece, selecciona "Exportar". Aparece un nuevo diálogo. Allí, marca la casilla "mostrar el ejemplo". aparecerá el tamaño del archivo de la imagen. Asegúrate de que sea por debajo de 300kB o no serás capaz de guardar el fondo.

Paso 6

Background gradient step 4

¡No más transiciones bruscas!

Ve a Special:ThemeDesigner en tu wiki y carga la imagen. ¡Voilà, un bonito fondo de aspecto! ¡Que se mezcla con el fondo!

Véase también

Ayuda complementaria y comentarios

El contenido de la comunidad está disponible bajo CC-BY-SA a menos que se indique lo contrario.