Animated playground

I am new to Babylon Playground. I just wanted to know if there is any playground that animates texts in characters’ pop-up view or even a hello word animation.
I have been facing difficulties locating such a playground. Does anybody know of such a playground?
Please help

Hello and welcome to the community!

The docs have a section an animation with pgs: Animation | Babylon.js Documentation (

Thank you for the reply.
However, I was asking about the playground found in the engine
For example
the hello world playground is just static
have you come across any playground that animates texts?

You can use the same techniques outlined in the animation documents for text properties, such as animating through the render loop: Babylon.js Playground (
or through Animations: Babylon.js Playground (

1 Like

wow! Thanks a lot. It really works
My objective is to have the 3d text loaded in letter by letter
like the “hello” pops up like |h| after n second |e| after n seconds |l| after n seconds |l| after n seconds |0|.
Can this be done with onBeforeRenderObservable method?

Certainly so! You can either change the mesh’s visibility property for a more gradual effect or isVisible if you just want to change a boolean

Hi. So I tried this, but it does not pop up the letters. I just don’t understand how to add a timer to the visibility property. can you please help

var text17: BABYLON.GUI.TextBlock = new BABYLON.GUI.TextBlock();
text17.text = “Hello world”;
text17.color = “white”;
text17.fontSize = 24;


    scene.onBeforeRenderObservable.add(() => {
        //text17.leftInPixels = Math.sin( * 0.001) * 100;


The 2D text class doesn’t have a visiblity property, only the 3D meshes. If you want to animate a 2D text visibility you can animate the alpha property. You increase it from 0 to 1, like Animation Using the Render Loop | Babylon.js Documentation (

No.I earlier said I want to animate a 3d text to pop up letter by letter.
I am so new to Babylon and I do not know if there is a playground for this to show me how it works. I have been trying with the script but not so sure. can you help?

Since you’re new to the framework, before trying to make anything I would highly recommend going through this introduction series Introduction to Babylon.js Features | Babylon.js Documentation since it shows you all the main Babylon features and helps you have a much better view of the framework.

Ok. Thanks. I’ll look it up
Thank you so much for your time


Please edit the last link you sent. It is a localhost link

I will reply for @carolhmj since the Team is a bit biz right now preparing for the big launch :rocket: of version 6 to happen TOMORROW. Don’t miss the event :clapper: with even more awesome features to come :smile:

This is the link:

Meanwhile, have a great day :sunglasses:

Sorry for that, I was editing some docs ~for 6.0~ and sent the localhost instead of the hosted link :sweat_smile: thanks for fixing it up mawa!