HTML + CSSInfo-bulles

Infobulle de statut

Un point vert pulse doucement à côté du message, pour que « Disponible maintenant » ait l'air vraiment en direct.

Réglages

16px
1x

Code

<button class="uv-tu"><i></i>Statut<span><b></b>Disponible maintenant</span></button>

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 Info-bulles

Où l’utiliser

Un statut inspire plus confiance quand il bouge un peu. Utilisez-la pour la mention « Disponible pour de nouveaux projets » d'un portfolio de freelance, le bouton d'assistance d'une boutique en ligne pendant les heures d'ouverture ou l'icône de chat de la réception d'un hôtel. Une infobulle de statut avec pulsation, en HTML et CSS.

N'affichez le vert que lorsqu'il dit vrai : un « disponible » qui pulse un dimanche soir fait plus de tort qu'aucune indication. Pour « occupé » ou « hors ligne », passez à l'orange ou au gris et coupez la pulsation.