Generador de degradados de malla

Crea fondos con degradados de malla atractivos

Generador de degradados de malla

Puntos de color

#F97316Posición: 20%, 30%

#E11D48Posición: 80%, 20%

#7C3AEDPosición: 50%, 80%

#06B6D4Posición: 10%, 70%

Tamaño del lienzo

CSS

background-color: #f97316;
background-image:
    radial-gradient(at 20% 30%, rgba(249,115,22,1) 0px, transparent 50%),
    radial-gradient(at 80% 20%, rgba(225,29,72,1) 0px, transparent 50%),
    radial-gradient(at 50% 80%, rgba(124,58,237,1) 0px, transparent 50%),
    radial-gradient(at 10% 70%, rgba(6,182,212,1) 0px, transparent 50%);

¿Qué es Generador de degradados de malla?

Genera impresionantes degradados de malla multicolor para fondos de sitios web, gráficos de redes sociales y diseños de interfaz. Personaliza la cantidad de puntos de color, sus posiciones y colores para crear degradados orgánicos únicos que van más allá de los patrones lineales o radiales simples.

Cómo usar

Elige tus colores base haciendo clic en las muestras de color o ingresando valores hexadecimales. Agrega hasta 6 puntos de control de color.
Arrastra los puntos de control sobre el lienzo para posicionarlos y ajusta el flujo del degradado a tu gusto.
Copia el código CSS generado o descarga el degradado como imagen PNG para usarlo en tus proyectos.

Resultado

Un diseñador de interfaces crea un degradado de malla de púrpura a turquesa con 4 puntos de control para la sección hero de una página de aterrizaje, y luego copia el CSS para pegarlo directamente en su hoja de estilos.

Generador de degradados de malla