HTML + CSSFondos
Humo de colores
Nubes de color que se arremolinan y crecen despacio, como tinta en el agua o humo de escenario.
Ajustes
1x
1x
1
Código
<div class="pt-smoke"><i style="--cc:var(--c1);--x:-20.0%;--y:34.5%;--ox:89.6%;--oy:41.7%;--t:20.6s"></i><i style="--cc:var(--c2);--x:16.1%;--y:-11.6%;--ox:84.4%;--oy:86.7%;--t:29.0s"></i><i style="--cc:var(--c3);--x:4.9%;--y:2.5%;--ox:87.5%;--oy:42.5%;--t:26.5s"></i><i style="--cc:var(--c1);--x:56.8%;--y:3.7%;--ox:60.6%;--oy:44.4%;--t:24.6s"></i><i style="--cc:var(--c2);--x:24.3%;--y:6.2%;--ox:89.8%;--oy:52.7%;--t:31.6s"></i><i style="--cc:var(--c3);--x:42.2%;--y:-14.4%;--ox:32.7%;--oy:56.5%;--t:22.5s"></i><i style="--cc:var(--c1);--x:-13.5%;--y:4.4%;--ox:45.8%;--oy:30.6%;--t:27.3s"></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.
Más en Fondos
Ver todos: FondosDónde usarlo
El humo de colores tiene un aire misterioso que funciona en el hero de una marca de perfumes, en la web de una coctelería o en el teaser de un disco nuevo. Siete nubes desenfocadas giran y se hinchan a distinta velocidad, y la mezcla nunca se repite igual. Un fondo de humo animado en CSS puro.
Brilla sobre fondo oscuro con dos o tres colores saturados; sobre blanco pierde casi todo el resplandor. Si pones texto encima, baja un poco la opacidad para que las nubes no se coman las letras finas.