Change color of the Axes

Hi everybody,

Is it possible to change the colors of the AxesViewer and the gizmos connected to the meshes ?

Thanks for your answers,


It is not exposed publicly but I guess you could at the moment do smthg like this:

axesViewer.xAxis.getChildMeshes().forEach(m => m.material...)

We d happily accept a PR to open the code for modification if you want ?

1 Like

Thanks for your answer, it works well.

And for the gizmos, is it the same way ? I’m able to create a simple AxisDrag Gizmo with its color but i cannot change the color for the default gizmos.

I’d like to change the code for the AxesViewer but i’m not sure i will be able to do it. I don’t want to break anything.

Thanks anyway for your answer.


Hey i’m new. What is needed in addition after “m.material…” to achieve the color change?

Hi @newbie123,

A PR has been done to change directly the color of the axes of the gizmos.

Here’s the code you can use (for instance for the translation gizmo):

var gizmoManager = new BABYLON.GizmoManager(scene)

gizmoManager.gizmos.positionGizmo.xGizmo._coloredMaterial.diffuseColor = [your color3 for the X Axis]
gizmoManager.gizmos.positionGizmo.yGizmo._coloredMaterial.diffuseColor = [your color3 for the Y Axis]
gizmoManager.gizmos.positionGizmo.zGizmo._coloredMaterial.diffuseColor = [your color3 for the Z Axis]

And for the rotation Gizmo, it’s exactly the same thing with

gizmoManager.gizmos.rotationGizmo.xGizmo._coloredMaterial.diffuseColor =

If you want to change the color when the mouse is over the gizmo, you can use :

gizmoManager.gizmos.rotationGizmo.xGizmo._hoverMaterial.diffuseColor =

Hope it helps



1 Like

Yeah actually i figured it out how to swap the materials. But thanks maybe i will use this solution later.

1 Like