HTML + CSSInterrupteurs

Lampe à tirette

Une lampe de banquier à tirette : tirez la perle vers le bas ou touchez-la, et la lumière s’allume en se balançant.

Réglages

16px
1x

Code

<label class="uvq03-pcd"><input type="checkbox" role="switch"><span class="lm"><i class="cn"></i><i class="cb"></i><i class="sh"></i><i class="bu"></i><span class="cd"><i class="bd"></i></span></span>Lampe de lecture</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.

Version Markdown avec tout le code, pour les assistants IA

Plus dans Interrupteurs

Voir tout : Interrupteurs

Où l’utiliser

Cet interrupteur est une lampe verte suspendue avec une tirette et une perle en bois. Vous pouvez tirer la perle vers le bas puis la relâcher, comme un vrai interrupteur à cordon, ou simplement cliquer ou toucher la lampe. L’ampoule brille, un cône de lumière chaude apparaît et le cordon se balance avant de s’immobiliser. Un court script gère le glisser, à la souris comme au doigt.

La couleur principale est l’abat-jour, la seconde la lumière. Laiton et ambre donnent une ambiance de bibliothèque, blanc et bleu froid une suspension moderne. La barre d’espace l’active toujours au clavier.