Mouse pointer

cursor

Set which cursor marker to use for tracking mouse movements.

Property values

This property accepts either a URL or a keyword. The following keywords can be specified:

auto The browser decides what to display based on the current context
default An arrow
none No cursor is visible
context-menu A context menu is available
help Help information is available
pointer A pointing hand that indicates a link
progress Something is happening, but the user can still interact with the interface
wait An hourglass or a watch, indicating that something is happening, and the user can't interact with the interface
cell The table cell or set of cells can be selected
crosshair Cross cursor, often used to indicate selection in a bitmap
text An I-beam, for text that can be selected
vertical-text Horizontal I-beam, for vertical text that can be selected
alias An alias or shortcut is to be created
copy Something is to be copied
move Something is to be moved
no-drop An item may not be dropped at the current location
not-allowed The requested action will not be carried out
grab Something can be grabbed or dragged
grabbing Something is being grabbed or dragged
all-scroll Something can be panned in any direction
col-resize The column can be resized horizontally
row-resize The row can be resized vertically
n-resize Resize towards the top
e-resize Resize towards the right
s-resize Resize towards the bottom
w-resize Resize towards the left
ne-resize Resize towards the top right corner
nw-resize Resize towards the top left corner
se-resize Resize towards the bottom right corner
sw-resize Resize towards the bottom left corner
ew-resize Resize left and right
ns-resize Resize up and down
nesw-resize Resize top-left to bottom-right
nwse-resize Resize top-right to bottom-left
zoom-in Something can be zoomed in
zoom-out Something can be zoomed out

Custom cursor

For a custom cursor, provide a URL that points to a bitmap containing a 32px by 32px image encoded as PNG, GIF, JPG, BMP or CUR. Specify an X Y pair of values to precisely pinpoint its "hotspot", and specify one of the standard keywords to be used as a fallback, in case the url can't be loaded.

Examples

cursor: crosshair;
cursor crosshair
cursor: url('https://example.com/bullseye.png') 16 16, crosshair;
cursor loaded from URL, with fallback to crosshair
0

style > interface > cursorMouse pointer

🔗 🔎