# Styling scrollbar

**URL:** https://community.appfarm.io/t/styling-scrollbar/333
**Category:** Ask the community
**Tags:** scroll
**Created:** [March 9, 2023, 12:19pm UTC](https://community.appfarm.io/t/styling-scrollbar/333 "2023-03-09T12:19:30Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![Seroosh](https://avatars.discourse-cdn.com/v4/letter/s/f475e1/32.png) [@Seroosh](https://community.appfarm.io/u/Seroosh)
#### Post date: [March 9, 2023, 12:19pm UTC](https://community.appfarm.io/t/styling-scrollbar/333/1 "2023-03-09T12:19:30Z")

</div>

Is there a way to stylize the scrollbars?

---

<div class="post-metadata">

### Author: ![Joanna](https://dub1.discourse-cdn.com/flex013/user_avatar/community.appfarm.io/joanna/32/122_2.png) [@Joanna](https://community.appfarm.io/u/Joanna)
#### Post date: [March 9, 2023, 1:46pm UTC](https://community.appfarm.io/t/styling-scrollbar/333/2 "2023-03-09T13:46:38Z")

</div>

Hi @Seroosh, there’s no built-in way to do it easily, but you can work your way around it using the Coded component. The easiest way would probably be to add an ID to your scrollable Container and place [styling](https://css-tricks.com/the-current-state-of-styling-scrollbars-in-css/) only inside of the coded component – this way the Coded component doesn’t need to interfere with your HTML structure.

---

<div class="post-metadata">

### Author: ![Erlend](https://avatars.discourse-cdn.com/v4/letter/e/779978/32.png) [@Erlend](https://community.appfarm.io/u/Erlend)
#### Post date: [March 12, 2023, 2:17pm UTC](https://community.appfarm.io/t/styling-scrollbar/333/3 "2023-03-12T14:17:55Z")

</div>

We have styled the scrollbar by having a coded component inside the header that is used for every page. Inside the coded component we used CSS for a general scrollbar and this works for all pages!