Fading Animation Classes

Bellow is a Demonstration of How Fading Animation Classes Works

Below you have two animations: FadeIn and FadeOut.

FadeOut Animation
FadeIn Animation
The animation above will fade out after 5 seconds. Click the refresh button to see it again.
The animation above will fade in after 5 seconds. Click the refresh button to reset it.

How to Use These Fading Effects in QuickCSS

To apply these fading animations, simply add one of the following classes to your element:

Fade Out: fadeout (starts visible, fades away after 5 seconds)

Fade In: fadin (starts invisible, fades in after 5 seconds)

Example Usage

<div class="your-class fadeout">This will fade out</div> <div class="another-class fadin">This will fade in</div>