The cursor property specifies the mouse cursor to be displayed when pointing over an element. The numbers in the table specify the first browser version that fully supports the property. Default. The browser sets a cursor. A comma separated list of URLs to custom cursors.

Mar 10, 2025 · The cursor CSS property sets the mouse cursor, if any, to show when the mouse pointer is over an element. The cursor setting should inform users of the mouse operations that can be performed at the current location, including: text selection, activating help or context menus, copying content, resizing tables, and so on.

Mar 5, 2016 · Tutorial on the 32 cursor types in CSS, and the 4 webkit types. Plus a quick look at the custom cursor using url() attribute. By Michael Gearon.

Types of CSS Cursors. Following are types of cursors we can use in CSS: General Cursors: This is the default cursor used in operating system. Links and Status Cursors: This include pointer cursor, loading cursor, wait cursor, progress cursor etc. Drag and Drop Cursor: This include grab cursor, grabbing cursor, no-drop cursor etc.

Jan 27, 2025 · The cursor property in CSS controls what the mouse cursor will look like when it is located over the element in which this property is set. Obviously, it’s only relevant in browsers/operating systems in which there is a mouse and cursor. They are used essentially for UX to convey the idea of certain functionality.

Feb 27, 2024 · Understand the use of CSS cursor types to enhance user interaction and experience on your website. This guide explores the array of cursor options available in CSS, providing insights into how and when to use them.

Mouse over the words to change the mouse cursor.

Here's a CSS rule that changes the cursor to a pointing hand when hovering over a button: cursor: pointer; Now, let's create a more complex example with multiple elements: .link { cursor: pointer; } .loading { cursor: wait; } .locked { cursor: not-allowed; }

Feb 20, 2024 · To change the cursor in CSS, you can use the cursor property. Here’s how you can do it: You simply specify the desired cursor type as the value of the cursor property. This property can be...

Aug 12, 2024 · Basic cursors are commonly used to indicate different types of interactions. Here are a few examples: default: The default arrow cursor. pointer: A hand cursor, typically used for links or buttons. crosshair: A crosshair cursor, often used for selection. move: Indicates that the element is movable. Example: b. Link Cursors.