1.0.6 ā¢ Published 2 years ago
page-progressbar-react v1.0.6
ā” Page Progressbar React
š” A Simple progressbar based on scroll state of a page using framer-motion
š Demo (https://page-progressbar-react.vercel.app/)
Installation
npm i page-progressbar-react
or
yarn add page-progressbar-react
Usage
You can import the PageProgressBar
component from the package after installing.
import PageProgressBar from "page-progressbar-react";
After importing, add <PageProgressBar />
to your desired page.
-pages / index.js;
import PageProgressBar from "page-progressbar-react";
export default function HomePage() {
return (
<>
<PageProgressBar />
{/* Your code here... */}
</>
);
}
Customization
Currently PageProgressBar
supports color
and height
props.
export default function HomePage() {
return (
<>
<PageProgressBar color="#2563eb" height={5} />
{/* Your code here... */}
</>
);
}
Props:
prop | type | default |
---|---|---|
color | string | #ec4899 |
height | number | 4px |