diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less
index 8e4c9776e5..7897851bd7 100644
--- a/apps/common/main/resources/less/buttons.less
+++ b/apps/common/main/resources/less/buttons.less
@@ -7,6 +7,7 @@
     color: @text-normal;
     border-width: @scaled-one-px-value-ie;
     border-width: @scaled-one-px-value;
+    opacity: @component-normal-opacity;
 
     .btnsize(@value) {
         min-width: @value;
@@ -52,11 +53,15 @@
     &:hover {
         color: @text-normal-ie;
         color: @text-normal;
+
+        opacity: @component-hover-opacity;
     }
 
     &:active, &.active {
         -webkit-box-shadow: none;
         box-shadow: none;
+
+        opacity: @component-active-opacity;
     }
 
     .caret {
diff --git a/apps/common/main/resources/less/colors-table-dark.less b/apps/common/main/resources/less/colors-table-dark.less
index f17d2beced..bc6d08ad81 100644
--- a/apps/common/main/resources/less/colors-table-dark.less
+++ b/apps/common/main/resources/less/colors-table-dark.less
@@ -109,6 +109,10 @@
         --image-border-types-filter: invert(100%) brightness(4);
         --image-border-types-filter-selected: invert(100%) brightness(4);
         --component-normal-icon-filter: invert(100%);
+
+        --component-normal-opacity: .8;
+        --component-hover-opacity: .8;
+        --component-active-opacity: .8;
         --component-disabled-opacity: .3;
         --button-icon-opacity: .8;
 
diff --git a/apps/common/main/resources/less/colors-table.less b/apps/common/main/resources/less/colors-table.less
index 5ccf210a90..2ffee91066 100644
--- a/apps/common/main/resources/less/colors-table.less
+++ b/apps/common/main/resources/less/colors-table.less
@@ -121,6 +121,10 @@
     --image-border-types-filter: none;
     --image-border-types-filter-selected: none;
     --component-normal-icon-filter: none;
+
+    --component-normal-opacity: .8;
+    --component-hover-opacity: .8;
+    --component-active-opacity: .8;
     --component-disabled-opacity: .4;
     //--button-icon-opacity: 1;
 }
@@ -195,6 +199,9 @@
 @button-header-active-icon-offset-x: var(--button-header-active-icon-offset-x, -20px);
 
 @component-normal-icon-filter: var(--component-normal-icon-filter);
+@component-normal-opacity: var(--component-normal-opacity, .8);
+@component-hover-opacity: var(--component-hover-opacity, .8);
+@component-active-opacity: var(--component-active-opacity, .8);
 @component-disabled-opacity: var(--component-disabled-opacity, .4);
 @button-icon-opacity: var(--button-icon-opacity, 1);