Cargando
HTML + CSSLoaders
Double hélice d'ADN
Deux rangées de points tournent l'une autour de l'autre comme un brin d'ADN.
Réglages
16px
1x
Code
<div class="uv-ldn" role="status"><span class="sr">Chargement</span><span style="--i:0"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:1"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:2"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:3"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:4"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:5"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:6"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:7"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:8"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:9"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:10"><i class="a"></i><b></b><i class="b"></i></span><span style="--i:11"><i class="a"></i><b></b><i class="b"></i></span></div>Prompt pour l’IA
Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.
Plus dans Loaders
Voir tout : LoadersOù l’utiliser
Les sites de science, de santé et de biotech peuvent faire patienter avec style grâce à cette hélice. Douze paires de points montent et descendent en décalé, rétrécissent et pâlissent en passant l'une derrière l'autre, tandis que de fins barreaux s'étirent et se replient entre elles. On croit voir un brin d'ADN tourner, uniquement avec des transformations CSS.
Deux couleurs marquent les deux brins et la vitesse règle la rotation. Utilise-le pendant le chargement de résultats d'analyse ou de dossiers médicaux. Il fait aussi un joli séparateur animé.