Design et Ressources

Générateur de CSS Transform

Construisez des chaînes CSS transform à partir de valeurs de transformation courantes.

Catégorie

Design et Ressources

Générateur de CSS Transform

css transformtranslaterotateGénérateur

Sortie

Generated transform CSS

Transform

translate(12px, -4px) rotate(8deg) scale(1.05) skew(0deg, 0deg)

Origine

Center

.transform-preview {
  width: 180px;
  height: 120px;
  border-radius: 24px;
  background: linear-gradient(135deg, #2563eb, #7c3aed);
  color: white;
  display: grid;
  place-items: center;
  transform-origin: center;
  transform: translate(12px, -4px) rotate(8deg) scale(1.05) skew(0deg, 0deg);
}

Transform Aperçu

Live canvas