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 degradados de malla multicolor para fondos de sitios web, gráficos de redes sociales y diseños de interfaz. Elige los colores, posiciona los puntos de control y consigue degradados orgá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 cambiar el flujo del degradado.
Copia el CSS o descarga el degradado como PNG.

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.

Herramientas relacionadas

Conversor de códigos de color

Convierte códigos de color HEX, RGB, HSL y CMYK

Conversor de colores

Convierte códigos HEX, RGB, HSL, HSV y CMYK

Mezclador de colores

Mezcla dos colores de forma visual

Buscador de nombres de color

Encuentra el color con nombre más cercano a cualquier valor

Buscador de colores complementarios

Encuentra colores complementarios para cualquier entrada

Explorador de colores de marca

Explora los colores de marcas populares