CSS: “cursor”: “arrow” is not a “cursor” value.

The CSS cursor property does not accept arrow as a value. To show the standard arrow pointer, use cursor: default, which is the platform's default cursor on most systems.

The cursor property sets the mouse pointer shown when the pointer is over an element. Its keywords are spelled out in the CSS specification, and arrow is not among them. The name people reach for is intuitive, since the everyday pointer is an arrow, but the keyword that produces it is default. When the validator meets cursor: arrow, it rejects the whole declaration, so the browser ignores it and falls back to whatever cursor it would have used anyway.

This usually goes unnoticed because the default cursor already is an arrow, so nothing looks broken. The cost shows up when you set cursor: arrow to override an inherited value, for example to reset the pointer back to normal inside an element that set cursor: pointer. The invalid declaration is dropped and the inherited cursor stays in place.

Invalid example

The value arrow is not recognized and triggers a validation error:

<div style="cursor: arrow;">
  Hover over me
</div>

Valid example

Use default to get the standard arrow pointer:

<div style="cursor: default;">
  Hover over me
</div>

Learn more:

MDN Reference

MDN Web Docs: cursor

→

W3C Reference

CSS Basic User Interface Module: cursor

→