Make A Custom Scrollbar

Build a custom scroll width, color and more using a simple javascript. You can also use Finsweet’s Chrome extension. The main code looks like so,

Width = Scrollbar width‍

Track = Progress bar

Handle = The draggable scrolling handle

Handle on hover = Color of the handle when you hover on it

Simply edit the values and paste it in the head code of your project settings

Styling

Change text selection color, style the scrollbar, and lots of custom code scripts that lets you do just that in a simple and effective way

Updated on:

August 17, 2022

Display Code Snippets With Syntax Highlighting And A Copy Button

Webflow - Code to the Rescue

The Webflow Library for custom code snippets that unlocks powerful possibilities in Webflow. Includes hand-picked and tested custom code that you can use in Webflow Projects.

Open Library

🚀

Need further help?

Need further help in understanding the resources or how to implement them? Feel free to reach out

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

About Ali Saeed

Ali Saeed is a Kuwait-based web designer and Webflow developer who has been working as a graphic designer for 4 years, building social brands, company profiles, and presentations. He recently jumped into web design and development. As a web designer, Ali focuses on clarity in design layout and messaging strategy. In his free time, he loves to help the web community, solve problems, and build resources for web designers who want to optimize their websites using Webflow.
‍
Send an email if you'd like to collaborate :)
View his portfolio website

Make A Custom Scrollbar

Create a Custom Button with a Notch in Webflow

Make A Custom Form Submit Button That Is Clickable

Write Vertical Text The Proper Way

Match Link Color To The Parent Div Block Or Paragraph Color By Default

Change Text Selection Color In Webflow

Display Code Snippets With Syntax Highlighting And A Copy Button

Webflow - Code to the Rescue