HTML + CSSCases à cocher
Case qui pivote en dégradé
La case se retourne en 3D et montre son autre face : un carré en dégradé avec la coche.
Réglages
16px
1x
Code
<label class="uv-ck2f"><input type="checkbox"><span class="bx"><i class="fr"></i><i class="bk"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12.5l4.5 4.5L19 7.5" pathLength="1"/></svg></i></span>Activer la 3D</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 Cases à cocher
Où l’utiliser
Le retournement est parfait pour les options que l’on ajoute une à une : « Ajouter le petit-déjeuner » lors d’une réservation d’hôtel, l’emballage cadeau au moment du paiement ou les garnitures d’une pizza à composer. Chaque case pivote comme une carte et l’on voit d’un coup d’œil ce qui est choisi. Une case à cocher 3D en CSS.
Le mouvement dure un peu plus qu’une coche classique : il convient mieux aux listes courtes qu’à une longue page de réglages. Ralentissez-le pour une marque posée, accélérez-le pour un ton plus joueur.