Usage no npm install needed!

<script type="module">
  import reactMulticolorLoadingBar from 'https://cdn.skypack.dev/react-multicolor-loading-bar';
</script>

README

react-colored-loading-bar

Here is the Demo.

Installation

npm install --save react-multicolor-loading-bar

Example Usage

import React from 'react'
import Loadingbar from 'react-multicolor-loading-bar'

const App = () => {
  return (
    <div>
      <Loadingbar
        colors={[darkBlue, darkOrange, darkBlue, lightOrange]}
        height={5}
        cycleDurationInMs={200}
        positionAtTop={true}
      ></Loadingbar>
    </div>
  )
}

export default App

Props

Below are the props you can pass to the Component to customize its behaviour.

Prop	Type	Default	description
colors	string[]	-	Colors codes to fill the loading bar with
height	number	-	Height of the bar
cycleDurationInMs	number	-	How soon you want to the bar to complete one cycle
positionAtTop	boolean	-	Whether to stick the bar at the top of the page

License

ISC licensed