List of 32 CSS cursors web developers must know about

Mouse Cursors may vary depending upon what operating system you are using (macOS, Windows, or Unix flavors) as well as the Browser type and version (Chrome, Safari, Firefox, Opera). But do you know as a web developer that there are about 32+ websafe mouse cursor options that are available in CSS that you can use for your website? The CSS property name is the cursor.

Let's see each of the 32 Different cursor types we have

Default Cursor :
The default cursor is the normal cursor that you see, depending on the operating system it may differ (for Google Chrome, Mac OS X has a pointer arrow that's black in color with a white border, whereas on Windows 8 the cursor is white in color with black border). If you want to use this cursor type then use cursor:default in the style of the element.
Auto Cursor :
This kind of cursor is is determined by the UA (User-Agent) depending upon the content on which the mouse is currently. The web browser determines the cursor to display based on the current context. E.g. equivalent to text when hovering text.
Crosshair Cursor :
You will see a cross kind of pointer when you use this type of cursor, this cursor type is usually used when you have to crop some image. cursor:crosshair is the CSS property that you must use.
Move Cursor :
This type of cursor is usually used when you want to drag/move something on a webpage, say you have an avatar image that the user can move to fit the exact portion of the image he/she wants to be in the frame. It looks similar to a cross-hair cursor, except that it has arrows at all four ends. The CSS property for this is cursor:move.
Pointer Cursor :
This cursor looks like a hand with a pointing finger (on the Mac OS X its a hand with a white glove on it seems :D), this cursor is usually displayed when you have a hyperlink. When you hover over any link on a page you would see this cursor to indicate that its a hyperlink.
Text Cursor :
This cursor is usually displayed when you hover over some text content on the page, it is usually displayed as a I-beam indication the user that the text can be selected (any yes copied to clip-board)
Wait Cursor :
This cursor is displayed when the page is waiting for some resource to get loaded. This is displayed as an hourglass on Windows OS and as a colorful circular spinning pinwheel.
Help Cursor :
This cursor is displayed as a question mark or a balloon. When displayed it indicates that help is available for the content.
Progress Cursor:
This may look similar to wait for cursor, but it's different as it is used to indicate the progress of something. It is usually displayed as a animated spinning beach ball or a pinwheel or an arrow with a watch or an hourglass.
e-resize Cursor
This cursor is an Indicator that you can resize or move something in East direction of the Screen. Its an arrow pointing towards the east direction.
w-resize Cursor
This cursor is an Indicator that you can resize or move something in the West direction of the Screen. Its an arrow pointing towards the west direction.
s-resize Cursor
This cursor is an Indicator that you can resize or move something in the South direction of the Screen. Its an arrow pointing towards the south direction.
n-resize Cursor
This cursor is an Indicator that you can resize or move something in the North direction of the Screen. Its an arrow pointing towards the north direction.
ne-resize Cursor
This cursor is an Indicator that you can resize or move something in North-East direction of the Screen. Its an arrow pointing towards the north-west direction.
nw-resize Cursor
This cursor is an Indicator that you can resize or move something in the North-West direction of the Screen. Its an arrow pointing towards the north-west direction.
se-resize Cursor
This cursor is an Indicator that you can resize or move something in the South-East direction of the Screen. Its an arrow pointing towards the South-East direction.
sw-resize Cursor
This cursor is an Indicator that you can resize or move something in the South-West direction of the Screen. Its an arrow pointing towards the South-West direction.
not-allowed Cursor :
This cursor is displayed on objects where some operations like copy, move, drag or drop is not allowed, it is usually displayed as an arrow having a circle with a stroke.
no-drop Cursor :
This cursor is displayed when the drop feature is not allowed on an object. It may look similar to the not allowed cursor type.
vertical-text Cursor :
This looks similar to text cursor except it displays the I-beam horizontally to indicate that the text which is displayed horizontally can be selected.
all-scroll Cursor :
This cursor indicates that scrolling in all directions is possible, usually displayed when you click on the mouse wheel button, indicates that you can move the mouse in all directions and the page will scroll in that direction.
Column resize Cursor :
This cursor indicates that a particular column is re-sizable, usually displayed when you place the cursor at the edge of the column.
Row resize :
This is similar to Column resize Cursor but used to indicate that the row is re-sizable.
URL Cursor :
This cursor doesn't seem to work on Mac OS X, it is used to display image along with the cursor pointer.
Grab Cursor
This cursor indicates that something can be grabbed.
Grabbing Cursor
This cursor indicates that something is being grabbed.
Zoom in Cursor :
This indicates that Zoom in option is available or activated for an element like an image on a webpage. It is displayed as a magnifying glass with a plus + sign.
Zoom out Cursor :
This indicates that Zoom out option is available or activated for an element like an image on a webpage. It is displayed as a magnifying glass with a minus - sign.
Cell Cursor :
This cursor is displayed as a thick + symbol (the one you see in excel sheets) it indicates that cells can be selected.
Alias Cursor :
This cursor type indicates an alias or shortcut is to be created.
Copy Cursor :
It indicates that the current object can be copied. It is displayed as a green circle with a plus sign on the Mac OS X.
Context Menu Cursor :
It indicates that a context menu is available under the cursor. Note on Windows it is available on ie10 or above.