Generador de transformaciones CSS 3D
Crea tarjetas o cubos 3D con controles y copia el CSS al instante
도구를 불러오는 중…
🔒 Todo se procesa 100 % en tu navegador. Tus archivos y datos nunca se suben a ningún servidor.
Esta herramienta permite ajustar controles deslizantes de rotación (X/Y/Z), perspectiva, translateZ y escala para crear efectos de tarjeta o cubo en 3D con vista previa en tiempo real. Resulta útil para desarrolladores y diseñadores web que crean tarjetas con efecto hover o animaciones de cubo giratorio, sin tener que adivinar los valores. Todo el procesamiento ocurre en el navegador, sin enviar datos a ningún servidor.
Cómo usar
- Elige el modo Tarjeta 3D o Cubo 3D.
- Ajusta los controles de Rotate X/Y/Z, Perspectiva, Translate Z y Escala para dar forma a la vista previa.
- Cuando el resultado te guste, pulsa Copiar CSS para obtener el código generado.
- Usa el botón Restablecer para volver todos los controles a sus valores predeterminados.
Preguntas frecuentes
- ¿Por qué importa el valor de perspective?
- La perspectiva crea la sensación de profundidad al rotar los elementos. Un valor menor exagera la distorsión 3D, mientras que uno mayor la aplana.
- ¿Puedo pegar el CSS generado directamente en mi proyecto?
- Sí, el código copiado incluye las reglas transform, transform-style y transition; solo aplícalo a las clases correspondientes.