# Button Style with conditions

**URL:** <https://community.glideapps.com/t/button-style-with-conditions/39825>\
**Category:** Ask for Help\
**Created:** [March 18, 2022, 6:23pm UTC](https://community.glideapps.com/t/button-style-with-conditions/39825 "2022-03-18T18:23:45Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![popina](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/popina/32/17164_2.png) [@popina](https://community.glideapps.com/u/popina)\
**Post date:** [March 18, 2022, 6:23pm UTC](https://community.glideapps.com/t/button-style-with-conditions/39825/1 "2022-03-18T18:23:45Z")

</div>

Hi, does anyone know if it is possible to assign a different style to a button depending on a condition? Ex: If an answer is correct I want a button to turn green and if it is not correct, to turn red.  
Thanks!

---

<div class="post-metadata">

**Author:** ![Darren\_Alderman](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_alderman/32/66660_2.png) [@Darren\_Alderman](https://community.glideapps.com/u/Darren_Alderman)\
**Post date:** [March 18, 2022, 8:54pm UTC](https://community.glideapps.com/t/button-style-with-conditions/39825/2 "2022-03-18T20:54:28Z")

</div>

Assuming you are talking about Apps and not Pages…

The most straightforward way to do this is with two separate buttons with different `Mood`s.

The button is green when the mood is `Success` and red when the mood is `Danger`.

Then you can use the visibility condition to control when each button shows based on if the answer is correct or not.

---

<div class="post-metadata">

**Author:** ![popina](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/popina/32/17164_2.png) [@popina](https://community.glideapps.com/u/popina)\
**Post date:** [March 19, 2022, 3:10am UTC](https://community.glideapps.com/t/button-style-with-conditions/39825/3 "2022-03-19T03:10:22Z")

</div>

Thanks! But in this case I cannot do that because I have 4 buttons, that correspond to different answers to a question, and I need to change only the color of the correct answer. The problem is the correct answer is not always in the same position…

---

<div class="post-metadata">

**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\
**Post date:** [March 19, 2022, 3:13am UTC](https://community.glideapps.com/t/button-style-with-conditions/39825/4 "2022-03-19T03:13:05Z")

</div>

Does it need to be a button? Not sure how the data is set up, but might be possible to use an inline list \> tiles \> background color is conditional of whether it’s right or wrong.

If not, you can use buttons, but you’ll instead have 8…one of each red/green. Then add visibility conditions to show the correct color based on the answer.

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [March 19, 2022, 3:41am UTC](https://community.glideapps.com/t/button-style-with-conditions/39825/5 "2022-03-19T03:41:07Z")

</div>

> [@Robert\_Petitto](#):
>
> Does it need to be a button? Not sure how the data is set up, but might be possible to use an inline list \> tiles \> background color is conditional of whether it’s right or wrong.

Inline list is the way to go. I did this recently for an app that had a small quiz included.

---

<div class="post-metadata">

**Author:** ![popina](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/popina/32/17164_2.png) [@popina](https://community.glideapps.com/u/popina)\
**Post date:** [March 21, 2022, 1:47pm UTC](https://community.glideapps.com/t/button-style-with-conditions/39825/6 "2022-03-21T13:47:08Z")

</div>

Thanks Robert! That looks very good!
