CSS Scrollbar Generator


You can use this generator to modify the look and colors of your website's scrollbars. Simply alter the options below to observe the change in the example area. All CSS code will be created automatically and ready for you to put into your project. For the scrollbars to work in Chrome, Edge, and Safari, we must use the vendor prefix -webkit-. Firesfox makes use of a variety of characteristics that are currently limited.

Preview

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eget feugiat ligula, in feugiat nisl. Proin tristique ultricies imperdiet. Donec aliquet orci ante, eu pharetra est convallis hendrerit. Morbi tempus feugiat nibh, tempor aliquam leo lacinia vitae. In sit amet orci dictum, mattis lectus vitae, feugiat odio. Maecenas maximus nisi laoreet dui cursus euismod. Donec quis feugiat metus. Nulla quis risus quis massa egestas varius. Aliquam ut est a ligula porttitor sodales vel eget tellus. Duis consectetur sem metus, eget rutrum nunc sollicitudin ac. Quisque eros arcu, feugiat ut tincidunt vitae, vestibulum eu risus. Mauris dictum odio in luctus placerat. Donec vestibulum gravida justo eget pharetra. Cras lobortis ante sit amet hendrerit commodo. Sed lacus enim, condimentum quis sodales nec, venenatis ut purus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse purus magna, accumsan eget viverra eu, pellentesque sit amet mauris. Fusce fringilla odio vel laoreet sodales. Proin hendrerit auctor lectus a pretium. Vestibulum in sodales massa. Maecenas mattis in sem at dignissim. Nunc volutpat ante sit amet ex suscipit, et pharetra diam rutrum. Aenean ut lectus a metus tincidunt ornare quis nec nunc. Praesent urna ante, auctor sit amet congue a, consequat id diam. Curabitur dapibus at nisi eget dignissim. Pellentesque sit amet lacus lorem. Ut scelerisque non enim id eleifend. Vestibulum ut lacus urna. Integer lectus tellus, sollicitudin a tristique ac, sagittis id ante. Integer viverra felis ante, ac scelerisque sapien molestie maximus. Cras tempor sollicitudin tortor, et ornare magna mattis eu. Aliquam semper augue id fermentum consequat. Mauris suscipit libero et malesuada finibus. Donec mollis eget dui at tempus. Morbi nibh purus, semper id erat in, ullamcorper rhoncus massa. Proin ullamcorper lacus sed sapien dictum tincidunt. Suspendisse et hendrerit risus, sed pretium nunc. Integer vestibulum ut lectus sed hendrerit. Aenean eu vehicula leo, at imperdiet metus. Nullam quis hendrerit leo. Pellentesque ac sem varius, dictum mi nec, auctor mi. Ut pulvinar sem sed quam sodales aliquet. Maecenas maximus, mauris eu laoreet tristique, erat nunc aliquet turpis, sit amet varius ligula ipsum non ante. Nulla erat augue, tincidunt eget risus ut, pretium commodo est. Aenean sit amet ligula dignissim, vulputate tortor id, fermentum mauris. In hac habitasse platea dictumst. Pellentesque molestie placerat cursus. Donec viverra sem rutrum, laoreet lacus id, placerat nulla. Vivamus facilisis lorem sit amet iaculis gravida. Aliquam mollis diam a molestie dapibus. Vestibulum sollicitudin, ante sit amet varius pretium, eros tortor ultrices elit, sit amet lacinia erat ipsum convallis urna. Aenean et consequat enim. Aenean fringilla ipsum eu convallis faucibus. In hac habitasse platea dictumst. Phasellus rutrum felis ut aliquet tristique. Donec quis eros eget urna egestas ultrices ac vel dui. Quisque auctor sem ac nibh finibus suscipit. Nunc nec dolor aliquam, tincidunt purus vel, cursus nunc. Duis sodales a est quis sagittis. Vestibulum ligula nulla, iaculis eu diam ultricies, luctus elementum sapien.

Scrollbar Properties
Background Color:
Hover Color:
Active Color:
10px
5px
Background Color:
Hover Color:
Active Color:
5px
Trackbar


Active Color:
0px
Thumb


Active Color:
0px
CSS Code

Related Resources

Tool Search by Keyword

IP Location

Your IP    Hide My IP
IP Location , ,   
ISP
Platform
Browser

Advertisement

Advertisement