CSS cursor property

Property values

auto

The shape of cursor depends upon the type of context. There will be text cursor over editable text field.

cursor: auto;

default

The default cursor is arrow.

cursor: default;

none

There is no cursor for the context.

cursor: none;

context-menu

An arrow with a menu type graphic.

cursor: context-menu;

help

question mark like icon is present under the arrow.

cursor: help;

pointer

pointer icon represents a link.

cursor: pointer;

progress

represents the program is in progress mode.

cursor: progress;

wait

The program is busy and user should wait.

cursor: wait;

cell

represents selected data of cells. It looks like a thick cell.

cursor: cell;

crosshair

indicates two dimensional bitmap selection. It looks like a thin cell.

cursor: crosshair;

text

indicates the selection of horizontal text. It looks like a vertical I shape.

cursor: text;

vertical-text

It indicates the selection of vertical text. It looks like horizontal I shape.

cursor: vertical-text;

alias

indicates shortcut to something. It consists of small curved arrow next to the cursor arrow.

cursor: alias;

copy

indicates something is to be copied.

cursor: copy;

move

The object is moveable or being dragged.

cursor: move;

no-drop

The required action can not be carried at the cursor location.

cursor: no-drop;

not-allowed

The dragged object can't be place at the cursor location.

cursor: not-allowed;

grab

The object is draggable.

cursor: grab;

e-resize

The purpose of the *-resize values is to move the edge.

cursor: e-resize;

n-resize

north cursor

cursor: n-resize;

ne-resize

north-east cursor

cursor: ne-resize;

nw-resize

north-west cursor

cursor: nw-resize;

s-resize

south cursor

cursor: s-resize;

se-resize

south-east cursor

cursor: se-resize;

sw-resize

south-west cursor

cursor: sw-resize;

w-resize

west cursor

cursor: w-resize;

ew-resize

east-west cursor

cursor: ew-resize;

ns-resize

north-south cursor

cursor: ns-resize;

nesw-resize

north-east-south-west bidirection cursor.

cursor: nesw-resize;

nwse-resize

north-west-south-east bidirection cursor.

cursor: nwse-resize;

col-resize

column resizable

cursor: col-resize;

row-resize

row resizable

cursor: row-resize;

all-scroll

It indicates that an object can be scrolled.

cursor: all-scroll;

zoom-in

magnifying glass with +ve sign.

cursor: zoom-in;

zoom-out

magnifying glass with -ve sign.

cursor: zoom-out;