Diseñadores, estudiantes y cualquier persona que cree un fondo de pantalla pueden usar los controles para dar forma a un degradado antes de exportarlo. La imagen se genera localmente en tu navegador, así que puedes crear un archivo sin subir tus elecciones de color a ningún otro sitio.
Cómo usar el Generador de fondos degradados
- Elige un Relleno de fondo: sólido, lineal o radial. Establece el Color principal y, después, agrega o elimina Puntos de degradado para crear la mezcla que quieras.
- Para un degradado lineal, ajusta el Ángulo del degradado (grados). Usa Semilla aleatoria y Preajuste de degradado (Mar o Anochecer) y selecciona Generar a partir de semilla para crear una variación basada en una semilla. Los puntos en la misma posición crean bordes nítidos intencionalmente.
- Elige un Preajuste de resolución de salida, como 1920x1080, 1080x1080 o 1080x1920. Selecciona Personalizada para introducir el Ancho de salida (píxeles) y el Alto de salida (píxeles).
- Selecciona PNG, JPG o WEBP en Formato de imagen. La vista previa es pequeña; selecciona Descargar imagen para generar y descargar el archivo a tamaño completo.
- Selecciona Copiar CSS del degradado base si necesitas el CSS del degradado base. Usa Pantalla completa para ampliar la escena, Ocultar controles para quitarlos de la vista o Restablecer para empezar de nuevo. Pulsa F para pantalla completa, R para restablecer y Escape para salir del modo de pantalla completa.
Cuándo usarlo
- Crear un fondo de pantalla para el escritorio: elige una resolución panorámica, como 1920x1080 o 3840x2160, para adaptarla a un formato de pantalla habitual.
- Crear un fondo para el teléfono: elige la opción vertical 1080x1920 para una composición alta.
- Preparar un fondo gráfico cuadrado: selecciona 1080x1080 para un lienzo cuadrado.
- Probar combinaciones de colores: ajusta el Color principal y los Puntos de degradado antes de descargar, en lugar de editar repetidamente los archivos exportados.
- Crear un fondo con un límite de color nítido: coloca puntos en la misma posición para crear un borde marcado intencionalmente.
- Partir de una opción conocida: elige Mar o Anochecer como Preajuste de degradado y genera una variación a partir de una semilla.
- Añadir un degradado a un diseño web: copia el CSS del degradado base como punto de partida para el estilo del fondo.
Consejos para crear mejores fondos degradados
Elige la forma de salida antes de ajustar los colores: un degradado que se ve equilibrado en una vista previa panorámica puede parecer distinto en una imagen vertical o cuadrada. Si tienes en mente un tamaño de lienzo específico, selecciona Personalizada e introduce el ancho y el alto.
| Opción | Qué afecta |
|---|---|
| Ángulo del degradado (grados) | Establece la dirección de un degradado lineal. |
| Puntos de degradado | Permiten controlar los colores y las transiciones de la mezcla; los puntos en la misma posición crean un borde nítido. |
| Formato de imagen | Están disponibles PNG, JPG y WEBP. JPG y WEBP pueden alterar los valores de los píxeles. |
| Resolución de salida | Establece las dimensiones de la imagen descargada. La resolución 8K depende del dispositivo. |
La vista previa es solo una representación pequeña: la imagen completa se genera al seleccionar Descargar imagen. Si vas a usar una implementación CSS, recuerda que Copiar CSS del degradado base describe solo el degradado base, no los patrones, el texto ni las formas adicionales.
Límites que debes tener en cuenta
El Generador de fondos degradados crea una imagen descargable, pero no garantiza que el resultado se vea igual en todas las pantallas o en todos los navegadores. La representación en Canvas y CSS puede diferir en los bordes, especialmente alrededor de los puntos de corte nítidos. JPG y WEBP también pueden cambiar los valores de los píxeles, así que elige PNG cuando sea importante conservarlos exactamente.
La salida máxima es de 33.177.600 píxeles y las exportaciones muy grandes pueden depender de tu dispositivo; no se garantiza que la resolución 8K funcione en todos los dispositivos. Si la descarga de un archivo grande es lenta o falla, elige una resolución menor o introduce dimensiones personalizadas más pequeñas. Para trabajos en los que el color sea crucial, comprueba la imagen exportada en el programa previsto y en la pantalla de destino.
