# CSS to change opinion scale button colour

**URL:** <https://community.surveysparrow.com/t/css-to-change-opinion-scale-button-colour/3237>\
**Category:** CSS Knowledge Bonanza! 🕺\
**Created:** [April 17, 2023, 8:25am UTC](https://community.surveysparrow.com/t/css-to-change-opinion-scale-button-colour/3237 "2023-04-17T08:25:19Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Venkata\_Abhijith](https://avatars.discourse-cdn.com/v4/letter/v/cab0a1/32.png) [@Venkata\_Abhijith](https://community.surveysparrow.com/u/Venkata_Abhijith)\
**Post date:** [April 17, 2023, 8:25am UTC](https://community.surveysparrow.com/t/css-to-change-opinion-scale-button-colour/3237/1 "2023-04-17T08:25:19Z")

</div>

CSS to change opinion scale button colour:

/\* Normal state \*/  
.ss\_rating\_input--classic .ss-answer-option--rating.ss-answer-option--bg{  
background: rgba(236, 165, 0, 0.5);  
}

/\* Hover state \*/  
.ss\_rating\_input--classic .ss-answer-option--rating.ss-answer-option--bg:hover{  
background: rgba(236, 165, 0, 0.7);  
}

/\* Active state \*/  
.ss\_rating\_input--classic .ss-answer-option--rating.ss-answer-option--bg.active{  
background: rgba(236, 165, 0, 1);  
}

 ![Screenshot 2023-04-17 at 1.54.21 PM](https://europe1.discourse-cdn.com/flex013/uploads/surveysparrow1/original/1X/13d287a54ac0c664e06f0ee70e738ae415012cae.png)

 ![Screenshot 2023-04-17 at 1.54.13 PM](https://europe1.discourse-cdn.com/flex013/uploads/surveysparrow1/original/1X/e5345bde7a41dfb780ee510217347cf39f887f3a.png)