HTML + CSSInterrupteurs
Toggle son activé ou coupé
Le haut-parleur émet des ondes qui pulsent quand le son est actif et se fait barrer quand il est coupé.
Réglages
16px
1x
Code
<label class="uv-tsd"><input type="checkbox" role="switch"><span class="tr"><span class="kn"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 9.5h3l4.5-4v13l-4.5-4H4z" fill="currentColor"/><path class="w1" d="M15 9.5a3.5 3.5 0 0 1 0 5"/><path class="w2" d="M17.5 7a7 7 0 0 1 0 10"/><path class="sl" d="M3 3l18 18" pathLength="1"/></svg></span></span>Son</label>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 Interrupteurs
Voir tout : InterrupteursOù l’utiliser
Les boutons de sourdine sont partout, des lecteurs vidéo aux jeux et aux outils de réunion, et l'icône doit rendre l'état évident d'un coup d'œil. Ici, la bille porte un haut-parleur : désactivé, une ligne rouge le barre ; activé, la ligne se retire, deux ondes apparaissent et pulsent doucement pendant que le rail passe au vert.
Utilise-le pour les sons de notification, la lecture automatique de vidéos, l'audio d'un jeu ou un lecteur de podcasts. Le libellé reste visible à côté, le sens ne dépend donc jamais de l'icône seule.