Cercle qui se dessine
Un arc qui s’allonge, tourne et se rétracte en une seule boucle fluide, le style popularisé par Android.
Réglages
Code
<svg class="ul-dc" viewBox="0 0 50 50"><circle cx="25" cy="25" r="20" pathLength="100"/></svg>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
Où l’utiliser
Si votre public a l’habitude d’Android ou des applis Google, ce spinner façon Material lui paraîtra tout de suite familier. Il convient au « tirer pour actualiser » d’un site d’actualités, à l’état de chargement d’un formulaire de connexion ou à une liste de messages en cours de récupération. L’arc s’étire et se rétracte en tournant, sans jamais sembler figé.
Il n’utilise que la couleur principale, ce qui en fait l’un des loaders les plus neutres ici. Entre 24 et 48 pixels, il s’intègre à presque toutes les interfaces. Si vous cherchez de la personnalité, passez votre chemin ; c’est justement sa force.