Specifies the type of cursor to display when the mouse pointer is over an element.
The cursor property sets the mouse cursor that is displayed when the pointer is over the element. It is used to signal to users what kind of interaction is possible.
Common values include pointer for clickable elements, text for text-selectable areas, move for draggable elements, and not-allowed for disabled elements. You can also provide a custom cursor image using the url() function with a fallback keyword.
Multiple cursor images can be specified as fallbacks, separated by commas. A keyword value must always be provided as the final fallback in case the custom cursor images cannot be loaded.
| Name | Description | Optional |
|---|---|---|
value |
A keyword (auto, default, pointer, text, move, grab, not-allowed, etc.) or url() for a custom image. | No |
.clickable {
cursor: pointer;
}
.disabled {
cursor: not-allowed;
}