Create Toggle Button

Hi All,

I need to create a toggle button on the canvas in the Babylon scene.
Something like this.
Can I use CSS style for this or there is any other way to create a toggle button on the canvas?

Yes you can use HTML and CSS with no problem (unless you want to support WebXR then you will have to use Babylon GUI)

1 Like

Can plz refer some examples where html & css is used in creating world space canvas in babylon?

Plz share the reference examples.

Here’s a simple example Babylon.js Playground

If you search the playground you’ll likely find more.


I need world space UI. Like a button is attatched to a mesh.

Did you search the playground?

It sounds like you’d be better off using Babylon GUI instead of HTML as those elements can be attached to meshes. See Babylon GUI Demo

I am using Babylon GUI but it has many styling restrictions.
That is why I asked if I can use CSS for styling

There is HTML example in Documentation - GUI | Babylon.js Documentation

PG example - Babylon.js Playground
Website implementation -

I want World space Ui. ex: button is attached to the mesh

You’d need to do something like this PG to move an overlaid HTML element in relation to a mesh.

Hi. There all in one pg answer all your questions
And second example with attached to mesh gui elements
But be aware. attached gui drop fps if many elements attached to many meshes