</h3>
<p>Animating an element via CSS when the element is created couldn&#39;t be simpler. Just add an animation to a CSS class normally:</p>
<pre><code class="lang-css">.fancy {animation:fade-in 0.5s;}
@keyframes fade-in {
    from {opacity:0;}
    to {opacity:1;}
}
</code></pre>
<pre><code class="lang-javascript">var FancyComponent = {
    view: function() {
        return m(&quot;.fancy&quot;, &quot;Hello world&quot;)
    }
}

m.mount(document.body, FancyComponent)
</code></pre>
<hr>
<h3 id="animation-on