Built-in Cursors

Cursors are changed to signal that the element that is under the cursor can be clicked, selected, or dragged. The cursor can be customized to be any image and even animated. However, it is much easier to use the built-in cursors, which can be set without supplying any additional files or URLs.

There are built-in cursors that can be used in HTML, as shown below. In the code below, we create two types of elements for each of these cursors: block (div) and inline (span). To see the cursor change, move the cursor over each of the elements.

Output

alias

all-scroll

auto

cell

context-menu

col-resize

copy

crosshair

default

e-resize

ew-resize

grab

grabbing

help

move

n-resize

ne-resize

nw-resize

ns-resize

no-drop

none

not-allowed

pointer

progress

row-resize

s-resize

se-resize

sw-resize

text

vertical-text

w-resize

wait

zoom-in

zoom-out

alias all-scroll auto cell context-menu col-resize copy crosshair default e-resize ew-resize grab grabbing help move n-resize ne-resize nw-resize ns-resize no-drop none not-allowed pointer progress row-resize s-resize se-resize sw-resize text vertical-text w-resize wait zoom-in zoom-out