AIMRAN
HTML + CSSFondos

Degradado mesh

Cinco manchas de color que se funden entre sí y se mueven despacio, como un degradado vivo.

Ajustes

1x
1x
1

Código

<div class="pt-mesh"><i></i><i></i><i></i><i></i><i></i></div>

Prompt para IA

Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.

Versión Markdown con todo el código, para asistentes de IA

Más en Fondos

Ver todos: Fondos

Fondo de aurora boreal

FondosHTML + CSS

Degradado que respira

FondosHTML + CSS

Atardecer líquido

FondosHTML + CSS

Rejilla de puntos en onda

FondosHTML + CSS

Rejilla synthwave

FondosHTML + CSS

Fondo de panal hexagonal

FondosHTML + CSS

Líneas diagonales con luz

FondosHTML + CSS

Campo de estrellas 3D

FondosHTML + CSS

Dónde usarlo

Un degradado mesh encaja muy bien en el hero de la landing de un SaaS, en la portada de un portfolio de diseño o en una página de lista de espera. Aporta color y un movimiento lento sin que ninguna forma le robe protagonismo al titular. Es un fondo degradado animado hecho solo con HTML y CSS, sin librerías.

Elige colores cercanos en el círculo cromático, como azul y violeta, y la mezcla quedará limpia. Si usas colores opuestos, se ensucian justo donde se tocan. Con texto blanco encima, baja un poco la opacidad o pon una capa oscura detrás del texto.