Saltar al contenido
🛠️ToolsShed

Generador de Cursor CSS

Explora todos los tipos de cursor CSS con previsualización en vivo y código listo para copiar.

Pasar por encima para vista previa

Acerca de esta herramienta

La propiedad CSS cursor controla el indicador visual que aparece cuando tu ratón se coloca sobre un elemento en una página web. Esta herramienta de diseño sutil pero poderosa comunica la interactividad a los usuarios, señalando si pueden hacer clic, arrastrar, cambiar el tamaño o interactuar con diferentes partes de tu interfaz. Ya sea que estés construyendo una aplicación web o diseñando un sitio web simple, elegir el tipo de cursor correcto impacta significativamente la experiencia del usuario y la profesionalidad percibida.

Este generador muestra todos los valores de cursor CSS estándar organizados por categoría, desde cursores de propósito general como default y none, hasta especializados para enlaces, selección de texto, arrastrar, cambiar tamaño y zoom. Simplemente explora las categorías, coloca el ratón sobre cada tipo de cursor para ver una vista previa en vivo de cómo aparece en la pantalla, y haz clic para copiar la declaración CSS lista para usar (cursor: value;) a tu portapapeles. Este flujo de trabajo elimina la necesidad de recordar sintaxis o buscar en documentación.

Los casos de uso comunes incluyen marcar elementos de formulario deshabilitados con not-allowed, mostrar cursores grab y grabbing para componentes arrastrables, y utilizar cursores de cambio de tamaño como col-resize o row-resize para indicar límites redimensionables. Los navegadores modernos soportan todos estos valores de cursor sin configuración adicional, lo que los convierte en una forma accesible de mejorar la usabilidad en interfaces de escritorio y pantalla táctil.

Preguntas Frecuentes

Comments & Feedback

Comments are powered by Giscus. Sign in with GitHub to leave a comment.