# Enabled (false) button - style

**URL:** <https://forum.inductiveautomation.com/t/enabled-false-button-style/97017>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [October 9, 2024, 12:25pm UTC](https://forum.inductiveautomation.com/t/enabled-false-button-style/97017 "2024-10-09T12:25:34Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [October 9, 2024, 12:25pm UTC](https://forum.inductiveautomation.com/t/enabled-false-button-style/97017/1 "2024-10-09T12:25:34Z")

</div>

Hello!

-I got a button, and it has a style for enabled form:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/3/c3b77931176e0294206c7e2c938088d183a1ea29.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/1/21d7373dcf324fb5de61c0542f83475c03c02d4b.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/7/97fb79bf0edccf3ce2e81632b48b2a70f2d5d666.png)

-My not enabled style comes by default as:

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/d/ed85dc64c89fc6bfd4ce13c31f0fbac100df92c3.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/a/ca37ab033ee87c794e93ee3f183a754c5e89f4a3.png)

Using same background color but changing color to some grey #dddddd maybe

Can I change the background color when is not enabled??

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [October 9, 2024, 12:31pm UTC](https://forum.inductiveautomation.com/t/enabled-false-button-style/97017/2 "2024-10-09T12:31:32Z")

</div>

In this case, just remove the background color when the button is disabled.

Personally I only apply styles on enabled buttons, I want the disabled style to be standard and the same everywhere, so I use something like this in the stylesheet:

```css
[data-component='ia.input.button'].ia_button--primary:not([disabled]) {
    styles...
}

[data-component='ia.input.button'].ia_button--secondary:not([disabled]) {
    styles...
}

```

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [October 9, 2024, 12:39pm UTC](https://forum.inductiveautomation.com/t/enabled-false-button-style/97017/3 "2024-10-09T12:39:33Z")

</div>

That works!, thanks Pascal.  
Yes, is good advice use always is possible primary buttons. Cheers.

```python
[data-component='ia.input.button'].ia_button--primary:not([disabled]) {
      background-color: #ff7900;
      color:white;
}

/* disabled*/
[data-component='ia.input.button'].ia_button--primary[disabled] {
    background-color: #d3d3d3;  
    color: #a9a9a9;  
    cursor: not-allowed;  
}

```