CSS Cursors Reference

Hover to preview, click to copy cursor CSS.

Ad

Hover over any box to see the cursor. Click to copy.

Ad

Frequently Asked Questions

How many CSS cursor values exist? +
CSS defines about 38 standard cursor values across general, link, status, selection, drag, resize, and zoom categories. Browsers may also support a few non-standard cursors. You can also use custom cursor images with the url() function.
How do I use a custom image as a CSS cursor? +
Use the cursor property with url() pointing to your image file, plus a fallback keyword: cursor: url('custom.png'), auto. Images should be 32x32 pixels or smaller. You can optionally set a hotspot offset: cursor: url('custom.png') 16 16, auto.
Why does my custom cursor not appear on some elements? +
The cursor property only works on elements that are actually rendered and have a visible area. Elements with display:none, zero dimensions, or those covered by other elements won't show the cursor. Also, browsers ignore cursors larger than 128x128 pixels on most platforms.
Ad
Copied!