transform

Ejemplos

Aceleración por hardware

Si tu transición funciona mejor cuando es renderizada por la GPU en lugar de la CPU, puedes forzar la aceleración por hardware agregando la utilidad transform-gpu:

<div class="scale-150 transform-gpu">
  <!-- ... -->
</div>

Usa la utilidad transform-cpu para forzar que las cosas vuelvan a la CPU si necesitas deshacer esto condicionalmente.

Eliminando transformaciones

Usa la utilidad transform-none para eliminar todas las transformaciones de un elemento a la vez:

<div class="skew-y-3 md:transform-none">
  <!-- ... -->
</div>

Usando un valor personalizado

Usa la sintaxis transform-[<value>] para establecer el transform basado en un valor completamente personalizado:

<div class="transform-[matrix(1,2,3,4,5,6)] ...">
  <!-- ... -->
</div>

Para variables CSS, también puedes usar la sintaxis transform-(<custom-property>) :

<div class="transform-(--my-transform) ...">
  <!-- ... -->
</div>

Esto es solo un atajo para transform-[var(<custom-property>)] que agrega la función var() por ti automáticamente.