HTML + CSSBoutons radio
Onglets verticaux lumineux
Une barre lumineuse monte et descend le long d’un rail fin jusqu’à l’option active.
Réglages
16px
1x
Code
<div class="uv-rdv"><span class="ln"><i></i></span><button>Aperçu</button><button class="on">Activité</button><button>Réglages</button><button>Aide</button></div>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 radio
Où l’utiliser
Il s’agit plus d’un menu latéral que d’un champ de formulaire : les sections d’un espace client, la barre latérale d’un tableau de bord avec aperçu, activité et réglages, ou les chapitres d’une documentation. La barre lumineuse glisse jusqu’à l’élément actif et l’on sait toujours où l’on est. Des onglets verticaux en HTML et CSS, avec un peu de JavaScript.
Le rendu est meilleur avec quatre à sept éléments de longueur proche. Sur un thème sombre, la lueur ressort très bien ; sur un thème clair, adoucissez-la pour éviter une barre qui paraît floue.