Estas clases cambian el tipo de cursor cuando el usuario pasa el mouse por encima del elemento.
| Clase Tailwind | Equivalente CSS | Ejemplo |
|---|---|---|
| cursor-auto | cursor: auto; | Cursor automático |
| cursor-default | cursor: default; | Cursor por defecto |
| cursor-pointer | cursor: pointer; | Haz clic |
| cursor-text | cursor: text; | Cursor de texto |
| cursor-not-allowed | cursor: not-allowed; | No permitido |
| cursor-wait | cursor: wait; | Esperando... |
| cursor-move | cursor: move; | Cursor de mover |
| cursor-help | cursor: help; | Cursor de ayuda |
| cursor-progress | cursor: progress; | Cursor de progreso |
| cursor-crosshair | cursor: crosshair; | Cursor de mira |
| cursor-none | cursor: none; | Sin cursor (pasa el mouse) |
| cursor-cell | cursor: cell; | Cursor de celda |
| cursor-grab | cursor: grab; | Cursor de agarre |
| cursor-grabbing | cursor: grabbing; | Cursor agarrando |
| cursor-zoom-in | cursor: zoom-in; | Cursor de zoom in |
| cursor-zoom-out | cursor: zoom-out; | Cursor de zoom out |
| cursor-alias | cursor: alias; | Cursor alias |
| cursor-all-scroll | cursor: all-scroll; | Cursor all-scroll |
| cursor-col-resize | cursor: col-resize; | Cursor col-resize |
| cursor-copy | cursor: copy; | Cursor de copia |
| cursor-e-resize | cursor: e-resize; | Cursor este (→) |
| cursor-n-resize | cursor: n-resize; | Cursor norte (↑) |
| cursor-ne-resize | cursor: ne-resize; | Cursor noreste (↗) |
| cursor-ns-resize | cursor: ns-resize; | Cursor norte-sur (↕) |
| cursor-nw-resize | cursor: nw-resize; | Cursor noroeste (↖) |
| cursor-se-resize | cursor: se-resize; | Cursor sureste (↘) |
| cursor-sw-resize | cursor: sw-resize; | Cursor suroeste (↙) |
| cursor-w-resize | cursor: w-resize; | Cursor oeste (←) |
| cursor-ew-resize | cursor: ew-resize; | Cursor este-oeste (↔) |
| cursor-row-resize | cursor: row-resize; | Cursor para filas |
| cursor-vertical-text | cursor: vertical-text; | Texto vertical |
| cursor-context-menu | cursor: context-menu; | |
| cursor-no-drop | cursor: no-drop; | No se puede soltar |
Controlan si el elemento puede recibir eventos del mouse o no.
| Clase Tailwind | Equivalente CSS | Ejemplo |
|---|---|---|
| pointer-events-none | pointer-events: none; | |
| pointer-events-auto | pointer-events: auto; |
Controlan si el usuario puede seleccionar el texto con el cursor.
| Clase Tailwind | Equivalente CSS | Ejemplo |
|---|---|---|
| select-none | user-select: none; | No seleccionable |
| select-text | user-select: text; | Selecciona este texto |
| select-all | user-select: all; | Seleccionar todo |
| select-auto | user-select: auto; | Comportamiento predeterminado |
Permite que los elementos (como <textarea>) se puedan redimensionar.
| Clase Tailwind | Equivalente CSS | Ejemplo |
|---|---|---|
| resize | resize: both; | |
| resize-none | resize: none; | |
| resize-x | resize: horizontal; | |
| resize-y | resize: vertical; |