Bouton mousqueton d'escalade
Le doigt du mousqueton s'ouvre au survol ; au clic, la bague de verrouillage monte, la corde se tend et tout est assuré.
Réglages
Code
<button class="uvq01-crb" type="button" aria-label="Assurer" aria-pressed="false"><svg viewBox="0 0 40 60" aria-hidden="true"><g class="rpg"><path class="rp" d="M-2 57C8 45 32 45 42 57"/><path class="rp2" d="M-2 57C8 45 32 45 42 57"/></g><path class="bd" d="M6 16a10 10 0 0 1 10-10h8a10 10 0 0 1 10 10v28a10 10 0 0 1-10 10h-8a10 10 0 0 1-10-10"/><g class="gt"><path d="M6 18v25"/><rect class="sl" x="3" y="33" width="6" height="9" rx="1.8"/></g></svg><span class="w" aria-hidden="true"><span class="a">Assurer</span><span class="b">Assuré</span></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 Boutons
Voir tout : BoutonsOù l’utiliser
Un interrupteur tiré d'un baudrier d'escalade : un mousqueton en aluminium anodisé orange traversé par une corde, à côté du libellé. Au survol, le doigt à ressort s'ouvre vers l'intérieur, et au clic la bague de verrouillage remonte sur le bec, la corde se tend d'un coup et le libellé passe à l'état assuré. Verrouillé, le doigt ne fait que frémir. Pour les salles d'escalade et boutiques outdoor.
La couleur principale est l'aluminium anodisé et la secondaire la corde : un mousqueton bleu avec une corde rouge se règle vite. L'état passe par aria-pressed, et avec le mouvement réduit chaque changement est immédiat.