Features

• Lightweight, < 1 kb
• Responsive, mobile-first.
• No dependencies + CDN.
• SVG, hence scalable and crisp.
• Can be used for websites and apps.
• Full screen or inline html.
• Supported by all browsers.

Installation

1. Download or clone . Then include in html

   
   <link rel='stylesheet' href='ac.css'>
   <script src='ac.js'> </script>
     

OR



2. Embed using CDN

   
   <script src='https://cdn.jsdelivr.net/npm/activity-indicator-material@1.0.2/ac.js'></script>
   <link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/activity-indicator-material@1.0.2/ac.css'>
     

Usage

1. Inline HTML

   
   <svg class="spinner" width="65px" height="65px" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">  
     

   Result

OR



2. In JavaScript (click "show Me" button on top of page for demo)

   
   activityIndicator.show() // displays full screen activity indicator
   activityIndicator.hide() // removes activity indicator