# Progress Bar - CSS to increase size (thickness)
**URL:** https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624
**Category:** Ask for Help
**Created:** [December 4, 2025, 4:48am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624 "2025-12-04T04:48:17Z")
**Posts on this page:** 11
**Page:** 1
### Author:  [@Holy-Mackerel](https://community.glideapps.com/u/Holy-Mackerel)
#### Post date: [December 4, 2025, 4:48am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/1 "2025-12-04T04:48:17Z")
Howdy,
I am looking to utilise Glide Progress bars in a Dashboard set up. To get them to fit with the style of the other assets in the Dashboard, I would like to increase the thickness of the progress bar itself.
Does anyone have any tips or CSS samples that can be used for this purpose ?
Regards
---
### Author:  [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [December 4, 2025, 5:45am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/2 "2025-12-04T05:45:04Z")
```auto
.custom-class [class^="wire-page-progress___StyledDiv2"] {
height: 0.85rem;
}
```
For a more varied progress bar, you can try making it with AI Component.
---
### Author:  [@Holy-Mackerel](https://community.glideapps.com/u/Holy-Mackerel)
#### Post date: [December 4, 2025, 6:54am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/3 "2025-12-04T06:54:06Z")
Thank you. Unfortunately I can not get it to update. I will inspect the component to ensure the class name has not changed
---
### Author:  [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [December 4, 2025, 7:03am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/4 "2025-12-04T07:03:18Z")
Have you already added the class name `"custom-class"` to your component?
---
### Author:  [@Holy-Mackerel](https://community.glideapps.com/u/Holy-Mackerel)
#### Post date: [December 4, 2025, 9:19pm UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/5 "2025-12-04T21:19:55Z")
> [@Himaladin](#):
>
> ```auto
> .custom-class [class^="wire-page-progress___StyledDiv2"] {
> height: 0.85rem;
> }
>
> ```
Ahhh no.
How does one do this please ?
---
### Author:  [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)
#### Post date: [December 4, 2025, 10:17pm UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/6 "2025-12-04T22:17:54Z")
> **[Custom CSS | Glide Docs](https://www.glideapps.com/docs/reference/user-experience/css-for-apps)**
>
> Customize the way your app looks with CSS.
---
### Author:  [@Holy-Mackerel](https://community.glideapps.com/u/Holy-Mackerel)
#### Post date: [December 4, 2025, 10:26pm UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/7 "2025-12-04T22:26:44Z")
Thanks Jeff. Apologies, yes I had added “custom-class” to the components Options panel (CSS Class) already.
Unfortunately no change to the size of the progress bar. → I have also increased the size within the Custom CSS to see if that forced the re-size but alas no go
---
### Author:  [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [December 5, 2025, 1:52am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/8 "2025-12-05T01:52:14Z")
Try copying the code below without using the custom class:
```auto
[class^="wire-page-progress___StyledDiv2"] {
height: 0.85rem;
}
```
If it still doesn’t work, please provide a screenshot of what you have done so far. I can’t guess what other possible issues there might be.
---
### Author:  [@Holy-Mackerel](https://community.glideapps.com/u/Holy-Mackerel)
#### Post date: [December 5, 2025, 2:26am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/9 "2025-12-05T02:26:27Z")
Perfect 👌
Removing the custom class worked a treat !
Thank you once again
---
### Author:  [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [December 5, 2025, 2:32am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/10 "2025-12-05T02:32:05Z")
A custom class name is needed if you want your CSS to affect only a specific progress-bar component and not others you have. If you want to apply your CSS globally, then you can skip using a custom class.
Please mark which part of the thread serves as the solution, so it can help other community members who face the same issue.
---
### Author:  [@Sekayi\_Liburd](https://community.glideapps.com/u/Sekayi_Liburd)
#### Post date: [December 5, 2025, 4:42am UTC](https://community.glideapps.com/t/progress-bar-css-to-increase-size-thickness/85624/11 "2025-12-05T04:42:39Z")
As @Jeff_Hager said, use the CUSTOM CSS –\> CSS CLASS spot on your component and insert:
custom-class
No full-stop in front… Then you can play with the height that you have inserted in the Appearance –\> Custom CSS text box. I tested it and it works for me.