CSS-3D-Transform-Generator
3D-Karten und Würfel per Regler gestalten und CSS kopieren
도구를 불러오는 중…
🔒 Alles läuft zu 100 % in Ihrem Browser. Ihre Dateien und Eingaben werden niemals auf einen Server hochgeladen.
Mit diesem Tool stellst du über Regler für Rotation (X/Y/Z), Perspektive, Translate Z und Skalierung 3D-Karten- oder Würfeleffekte ein und siehst das Ergebnis in Echtzeit. Es hilft Webentwicklern und Designern, die Hover-Karten oder rotierende Würfelanimationen erstellen, ohne Werte zu erraten. Die gesamte Berechnung läuft im Browser, es werden keine Daten an einen Server gesendet.
Anleitung
- Wähle den Modus 3D-Karte oder 3D-Würfel.
- Passe die Regler für Rotate X/Y/Z, Perspektive, Translate Z und Skalierung an, um die Vorschau zu formen.
- Klicke auf CSS kopieren, sobald dir das Ergebnis gefällt.
- Mit der Zurücksetzen-Schaltfläche kehren alle Regler zu den Standardwerten zurück.
FAQ
- Warum ist der Perspective-Wert wichtig?
- Die Perspektive erzeugt den Tiefeneindruck bei der Rotation. Ein kleinerer Wert verstärkt die Verzerrung, ein größerer lässt das Element flacher wirken.
- Kann ich das erzeugte CSS direkt einsetzen?
- Ja, der kopierte Code enthält transform, transform-style und transition — wende ihn einfach auf die passenden Klassennamen an.