Cube 3D
Un cube isométrique qui tourne sur son axe, chaque face dans une teinte un peu différente pour paraître plein.
Réglages
Code
<div class="ul-cube-w"><div class="ul-cube"><i></i><i></i><i></i><i></i><i></i><i></i></div></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 Loaders
Où l’utiliser
Un cube 3D en CSS pur évoque les colis et les briques de construction sans un mot. Utilisez-le sur la page de suivi d’un transporteur, pendant qu’un configurateur de produit en 3D prépare son modèle ou lors de l’envoi de fichiers dans une appli de stockage en ligne. Les faces sont ombrées, sans image ni bibliothèque.
Choisissez une couleur principale de ton moyen : les faces latérales en sont assombries automatiquement, et une couleur très foncée ne laisse aucun contraste. Prenez une seconde couleur plus claire, car elle peint le dessus et le dessous du cube.