78%
Studio One
4 h 28 min restantes
HTML + CSSCartes
Carte état de l'appareil
Un anneau de batterie avec voyant de connexion, autonomie restante et deux mesures, qui respire doucement au survol.
Réglages
16px
1x
Code
<article class="uv-cdevice"><header><i></i><span>EN LÍNEA</span><button>•••</button></header><div class="ring"><b>78<small>%</small></b><i></i></div><h3>Studio One</h3><p>4 h 28 min restantes</p><footer><span>Température <b>32°</b></span><span>Puissance <b>18 W</b></span></footer></article>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 Cartes
Où l’utiliser
Pensée pour les applications compagnons et les panneaux de contrôle : la batterie d'un vélo électrique, une enceinte dans un tableau de bord domotique, une station d'énergie portable ou un casque sans fil. L'anneau montre la charge, avec en dessous l'autonomie restante et deux mesures comme la température et la puissance : l'état de l'appareil se lit d'un coup d'œil.
Les 78 % sont fixés dans les styles : modifiez-les en même temps que le chiffre quand vous branchez de vraies données. Passez le voyant vert au gris si l'appareil se déconnecte ; un anneau qui continue de pulser sans connexion induit en erreur.