Convertisseur de couleurs
Convertissez HEX, RGB et HSL avec transparence, visualisez la couleur et copiez les valeurs CSS.
Générateur de transformations CSS 2D et 3D
Réglez déplacement, rotation, échelle, inclinaison et origine, avec des commandes 3D et de perspective en option.
Options 3D
Aperçu
Le contour pointillé indique la position initiale. L’ordre des transformations change le résultat ; le CSS exporté reprend celui de l’aperçu.
CSS
À propos de cet outil
Positionnez ou inclinez un élément en le comparant à son contour initial.
Mode d’emploi
Ajustez la translation X/Y, la rotation, les échelles, l’inclinaison et l’origine en vous repérant au contour initial. Activez la 3D pour ajouter la perspective, la translation Z et les rotations X/Y. Copiez ou téléchargez les déclarations transform et transform-origin.
L’aperçu et l’export emploient les mêmes paramètres dans un ordre fixe ; réordonner les fonctions peut changer le rendu. Une échelle négative retourne l’élément, une échelle nulle l’aplatit sur cet axe. L’outil produit des styles, pas un modèle 3D ni une animation complète.
Questions fréquentes
Peut-on changer l’ordre des fonctions ?
Vous pouvez modifier l’ordre à la main dans le CSS exporté ; l’interface n’a pas de commande de réorganisation. Aperçu et export suivent le même ordre fixe. Le changer peut modifier le résultat. Une échelle négative inverse l’axe ; zéro l’écrase.
Pourquoi un élément déplacé ou agrandi laisse-t-il son emplacement initial ?
Une transformation CSS modifie le dessin de l’élément sans déplacer sa boîte d’origine dans la mise en page. Les éléments voisins gardent donc leur position. Utilisez les règles de mise en page pour gérer l’espacement, et transform-origin pour choisir le point de référence de la transformation visuelle.
Outils associés
S’ouvre dans un nouvel onglet
Commentaires
0