In this article, we will create a simple progress bar that will serve as an indicator of how far a user scrolled down the website. It can be very useful for a blog or any other type of website that has some extra text.
This way, readers will know how much of the post is left to read, allowing them to manage their reading time and providing useful feedback as they scroll.
As you can see, we only need a few lines of CSS code to style the progress bar. Basically, we want it to be fixed at the top of the page (or it can be on the bottom as well; simply change the top property to bottom!