HTML + CSSFondos
Gotas en el estanque
Anillos que se abren sobre el agua oscura en puntos al azar, como gotas cayendo en un estanque en calma.
Ajustes
1x
1x
1
Código
<div class="pt-pond"><i style="left:5.0%;top:35.7%;--t:8.7s;--dl:-1.2s"></i><i style="left:57.3%;top:25.3%;--t:7.2s;--dl:-3.6s"></i><i style="left:42.5%;top:81.0%;--t:7.6s;--dl:-1.3s"></i><i style="left:43.0%;top:17.7%;--t:8.1s;--dl:-4.3s"></i><i style="left:18.3%;top:27.9%;--t:7.6s;--dl:-1.9s"></i><i style="left:74.9%;top:64.7%;--t:6.7s;--dl:-6.3s"></i><i style="left:88.1%;top:40.0%;--t:5.1s;--dl:-5.2s"></i><i style="left:70.5%;top:17.5%;--t:5.2s;--dl:-1.4s"></i><i style="left:64.5%;top:56.0%;--t:6.2s;--dl:-7.5s"></i><i style="left:83.9%;top:91.5%;--t:7.8s;--dl:-0.5s"></i><i style="left:18.7%;top:43.2%;--t:8.4s;--dl:-7.7s"></i><i style="left:50.0%;top:40.9%;--t:8.4s;--dl:-1.8s"></i><i style="left:94.9%;top:41.1%;--t:6.2s;--dl:-6.9s"></i><i style="left:81.2%;top:11.5%;--t:8.4s;--dl:-4.5s"></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
Las ondas en el agua hablan de calma, por eso funcionan en una app de mindfulness, en la web de un balneario o en la reserva de un retiro junto a un lago. Las gotas caen al azar y el ritmo nunca parece mecánico. Un fondo de ondas de agua animado en HTML y CSS, sin imágenes.
Para contenido de meditación o de sueño, baja un poco la velocidad; por defecto se parece más a una lluvia ligera. Un titular grande y fino en blanco queda estupendo flotando sobre los anillos, sobre todo con la opacidad algo más baja.