# How do I change the cursor imperatively?

**URL:** <https://forum.babylonjs.com/t/how-do-i-change-the-cursor-imperatively/23417>\
**Category:** Questions\
**Created:** [August 29, 2021, 1:10pm UTC](https://forum.babylonjs.com/t/how-do-i-change-the-cursor-imperatively/23417 "2021-08-29T13:10:52Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![sairens](https://avatars.discourse-cdn.com/v4/letter/s/b782af/32.png) [@sairens](https://forum.babylonjs.com/u/sairens)\
**Post date:** [August 29, 2021, 1:10pm UTC](https://forum.babylonjs.com/t/how-do-i-change-the-cursor-imperatively/23417/1 "2021-08-29T13:10:52Z")

</div>

I’d like to change the cursor upon a keyboard key press event, rather than setting a `hoverCursor` on a particular hoverable thing.

I came across this thread which added a `hoverCursor` property to `Scene` and the description seemed to imply it would suit my needs, but unfortunately it doesn’t seem to work:

[https://www.babylonjs-playground.com/#8B4IV5](https://www.babylonjs-playground.com/#8B4IV5)

I’ve tried setting the CSS style on the `canvas` element and this has an effect, but only for a split second, as BabylonJS seems to be overwriting the inlined `style` every frame. I guess setting the CSS cursor style on a wrapper element around the canvas would work… but is there a better way?

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [August 29, 2021, 1:45pm UTC](https://forum.babylonjs.com/t/how-do-i-change-the-cursor-imperatively/23417/2 "2021-08-29T13:45:04Z")

</div>

Hello!  
Have a look at this:  
[https://www.babylonjs-playground.com/#21YCLG#61](https://www.babylonjs-playground.com/#21YCLG#61)

---

<div class="post-metadata">

**Author:** ![Blake](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/blake/32/21509_2.png) [@Blake](https://forum.babylonjs.com/u/Blake)\
**Post date:** [August 29, 2021, 3:26pm UTC](https://forum.babylonjs.com/t/how-do-i-change-the-cursor-imperatively/23417/3 "2021-08-29T15:26:20Z")

</div>

I think what you’re looking for is scene.defaultCursor (scene.hoverCursor works when hovering over interactive elements). Note there can also be an issue with needing to move the cursor to see the newly set cursor type but I think it’s a browser issue not a BABYLON issue…

[https://www.babylonjs-playground.com/#8B4IV5#2](https://www.babylonjs-playground.com/#8B4IV5#2)

---

<div class="post-metadata">

**Author:** ![sairens](https://avatars.discourse-cdn.com/v4/letter/s/b782af/32.png) [@sairens](https://forum.babylonjs.com/u/sairens)\
**Post date:** [August 30, 2021, 7:40am UTC](https://forum.babylonjs.com/t/how-do-i-change-the-cursor-imperatively/23417/4 "2021-08-30T07:40:46Z")

</div>

Thanks for the replies guys!

Unfortunately I need that cursor style to be applied without a pointer move, so I ended up opting for the pure CSS approach (wrapping the canvas inside a div and setting the style.cursor on that with js). Hope this helps anyone else with the same problem