Syntax

Animation Timing Function

Setting speed curve of the animation.

🚧This page is still under construction and some content may not be complete.

Overview

ClassDeclarations
@easing:function,animation-timing-function: function,;
@easing:easeanimation-timing-function: ease;
@easing:ease-inanimation-timing-function: ease-in;
@easing:ease-outanimation-timing-function: ease-out;
@easing:linearanimation-timing-function: linear;
@easing:step-startanimation-timing-function: step-start;
@easing:step-endanimation-timing-function: step-end;

Conditionally apply

Apply styles based on different states using selectors and conditional queries.

<div class="@easing:ease:hover @easing:ease@sm @easing:ease@dark @easing:ease@print"></div>
Syntax
Animation Play State

Setting whether an animation is running or paused.

Syntax
Appearance

Controlling the native appearance of UI controls.

© Aoyue Design LLC.