Cursor

You might say

Change the cursor to a pointer when it moves over something clickable.

The mouse pointer changes shape to preview whether an area can be clicked, typed in, dragged, or is currently unavailableWhen a mouse moves over an element, CSS cursor can show a familiar system pointer: pointer for clickable areas, text for editable text, grab for draggable objects, and not-allowed as an extra unavailable-state cue. These shapes vary by platform and cannot replace clear controls, labels, focus styles, or disabled behavior. Touchscreens usually show no mouse pointer. The blinking insertion line inside a text field is the caret, not the mouse pointer.

Move your mouse to feel each pointer change These changes only appear on mouse or trackpad devices The exact system shapes may differ slightly

CSS cursor

Plain content

This is ordinary reading text.

default

Clickablepointer

Editabletext

Draggablegrab / grabbing

Unavailablenot-allowed

Mouse pointer Cursor and text caret

Mouse pointerFollows the mouse and previews the available interaction.

Insert hereText caretAppears after focusing a text field and marks the insertion point.

You can say this to an AI Agent

Audit cursor usage: follow the product convention for clickable controls, use text for input, grab and grabbing for drag handles, and not-allowed for disabled actions. Treat cursors as secondary cues and preserve meaning on touch.

A practical request for an AI Agent

Check whether the mouse pointers on this page match the actual interactions. Review buttons and links, text fields, draggable cards, and disabled actions separately; do not add custom image cursors. Then hover each area with a mouse and tell me what you changed.

Typical use cases

The pointer changes with the drag state

Hover Hold

An unavailable action still needs an explanation

Publish projectConnect a domain before publishing

Recommended tool

Web fine-tuning tool · Selector Pro

Select page elements for precise AI edits

Click a button, text, or card, note the change, then copy its exact location to AI.

Open Selector Pro website

A draggable card, text field, and disabled button all show the same hand cursor. How should this be corrected?

A. Keep pointer everywhere so users know all three regions deserve attentionB. Remove visual differences between controls and rely only on cursor shape for meaningC. Use grab, text, and not-allowed by actual role while keeping clear control styling