What is CSS Cursor?
An interactive reference for every standard CSS cursor value — pointer, grab, crosshair, help, not-allowed, the resize cursors and more. Hover any box to see the cursor in action and click to copy the matching cursor declaration.
How CSS Cursor works
The CSS cursor property sets which mouse pointer appears over an element.
Example: cursor: pointer; shows the hand used for links and buttons; cursor: not-allowed; shows the blocked symbol. This page applies each value to a box so you can preview it.
Common uses
- See exactly how each cursor looks
- Pick the right cursor for buttons and drag handles
- Copy the cursor CSS value
- Reference all available cursor keywords
Frequently asked questions
What cursor should a button use?
cursor: pointer is the convention for clickable elements like buttons and links.
How do I show a 'loading' cursor?
Use cursor: progress (busy but interactive) or cursor: wait (fully busy).
Can I use a custom image cursor?
Yes — cursor: url(my.png), auto; lets you set a custom image with a fallback.