Pure CSS Cross-Browser Loading Animations | whirl.css

Whirl is a CSS animation loading manipulation (whirls! 😅). It started as a drop into a CSS file for easy animations with: pseudo-elements. It also comes with a loading overlay that covers the target area.

loading animation download, loading animations free, loading animations css, cool loading animations

Supported loading animations.

  • traditional
  • duo
  • double-up
  • sphere
  • sphere-vertical
  • bar
  • bar-follow
  • line
  • line grow
  • line back-and-forth
  • shadow
  • shadow oval/shadow oval left
  • shadow oval right
  • ringed
  • blade
  • helicopter

Created Simulates Inspired Loading Animation Effect In JavaScript | Atom.io

How to make use of it:

All you need is to include whirl.css in the header section of your document:

<link href="dist/whirl.css" rel="stylesheet">

Then add the base CSS class “whirl” to the HTML element, along with any of the animation’s names.

<div class="whirl duo">
  ...
</div>

Simple Cross-Browser Pure CSS Loading Animations, whirl.css Plugin/Github


See Demo And Download

Official Website(jh3y): Click Here

This superior jQuery/javascript plugin is developed by jh3y. For extra Advanced Usages, please go to the official website.

Related Posts

Confetti-Falling-Animation-Effect-party

Confetti Falling Animation Effect In JavaScript | party.js

Party.js is a JavaScript library to brighten user site experience with visual effects! Celebrate success with dom confetti! The library is written in TypeScript and compiled into…

Star-Rating-JavaScript

Select Box Based Star Rating JavaScript Library | star-rating.js

star-rating.js is a small JavaScript library to create a customizable and gradually improved star rating control from a regular tick box with numeric values. The ES6 module…

Bootstrap-Show-Notification

Corner Fixed Notifications Alerts With Bootstrap | BS4 Show Notification

Bootstrap Notification is an easy-to-use jQuery plugin that uses the Bootstrap Alerts component to create static, rejectable, and stackable notification popups in the upper right corner of the…

Stackable-Multi-level-Sidebar-Menu

Create Stackable Multi-level Sidebar Menu | HC Off-canvas Nav

Multi-Level Sidebar Slide Menu – HC MobileNav is a jQuery plugin for creating multi-level, mobile-first, totally accessible, off-canvas facet navigation that helps the infinite nesting of submenu…

vue-masonry-gallery

Responsive Masonry Layout with SSR Support for Vue 3 | vue-masonry-wall

Vue masonry wall is a responsive masonry layout component for Vue 3 to deliver a Masonry-style responsive grid layout with SSR and RTL layout support. Features 📱…

bootstrap-5-bs-toaster

A Bootstrap 5 Toast Notification Framework Library | bs-toaster

bs-toaster is simple to instantiate bs-toaster and create multiple toasts effortlessly using native Bootstrap 5! Feature Facts Small and clean Modern browser support. No IE sorry 💥…