diff --git a/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap b/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap
index 5b4e3eae43..82497cc1fd 100644
--- a/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap
+++ b/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`components/AutosizeTextarea should match snapshot, init 1`] = `
       Object {
         "background": "none",
         "borderColor": "transparent",
-        "opacity": 0.5,
+        "opacity": 0.75,
         "overflow": "hidden",
         "pointerEvents": "none",
         "position": "absolute",
diff --git a/webapp/channels/src/components/about_build_modal/about_build_modal_cloud/about_build_modal_cloud.scss b/webapp/channels/src/components/about_build_modal/about_build_modal_cloud/about_build_modal_cloud.scss
index b6af3b6e57..875dcb4280 100644
--- a/webapp/channels/src/components/about_build_modal/about_build_modal_cloud/about_build_modal_cloud.scss
+++ b/webapp/channels/src/components/about_build_modal/about_build_modal_cloud/about_build_modal_cloud.scss
@@ -65,14 +65,14 @@
                 height: 20px;
                 align-self: center;
                 margin: 0 0;
-                color: rgba(var(--center-channel-color-rgb), 0.64);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 14px;
                 line-height: 20px;
             }
 
             .about-footer {
                 margin-top: 16px;
-                color: rgba(var(--center-channel-color-rgb), 0.64);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 12px;
                 line-height: 16px;
 
diff --git a/webapp/channels/src/components/admin_console/billing/billing_history.scss b/webapp/channels/src/components/admin_console/billing/billing_history.scss
index 5ff9f3bb5e..15101c2db4 100644
--- a/webapp/channels/src/components/admin_console/billing/billing_history.scss
+++ b/webapp/channels/src/components/admin_console/billing/billing_history.scss
@@ -98,7 +98,7 @@
 
 .BillingHistory__table-bottomDesc {
     margin-top: 4px;
-    color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+    color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     font-size: 12px;
     line-height: 16px;
 }
@@ -181,7 +181,7 @@
         }
 
         &:disabled {
-            opacity: 0.6;
+            opacity: 0.73;
         }
 
         &:hover:not(:disabled) {
diff --git a/webapp/channels/src/components/admin_console/billing/billing_history_modal.scss b/webapp/channels/src/components/admin_console/billing/billing_history_modal.scss
index fe2994cab9..fe26ff2dd3 100644
--- a/webapp/channels/src/components/admin_console/billing/billing_history_modal.scss
+++ b/webapp/channels/src/components/admin_console/billing/billing_history_modal.scss
@@ -31,7 +31,7 @@
         }
 
         .close {
-            color: rgba(#3f4350, 0.56) !important;
+            color: rgba(#3f4350, 0.75) !important;
         }
     }
 }
diff --git a/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limit_card.scss b/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limit_card.scss
index a0affbba15..8fdac21c0f 100644
--- a/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limit_card.scss
+++ b/webapp/channels/src/components/admin_console/billing/billing_subscriptions/limit_card.scss
@@ -28,7 +28,7 @@
 
     &__status {
         padding-bottom: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
 
         &--exceeded {
diff --git a/webapp/channels/src/components/admin_console/billing/billing_summary/billing_summary.scss b/webapp/channels/src/components/admin_console/billing/billing_summary/billing_summary.scss
index 1d6653d67f..4a6a4b92b1 100644
--- a/webapp/channels/src/components/admin_console/billing/billing_summary/billing_summary.scss
+++ b/webapp/channels/src/components/admin_console/billing/billing_summary/billing_summary.scss
@@ -95,7 +95,7 @@
 
 .BillingSummary__lastInvoice-date {
     margin-top: 8px;
-    color: rgba(var(--sys-center-channel-color-rgb), 0.72);
+    color: rgba(var(--sys-center-channel-color-rgb), 0.75);
 }
 
 .BillingSummary__lastInvoice-productName {
@@ -132,7 +132,7 @@
 }
 
 .BillingSummary__lastInvoice-partialCharges {
-    color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+    color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     font-size: 12px;
     line-height: 16px;
 
diff --git a/webapp/channels/src/components/admin_console/billing/billing_summary/upsell_card.scss b/webapp/channels/src/components/admin_console/billing/billing_summary/upsell_card.scss
index 1fff74f864..50e0c8739d 100644
--- a/webapp/channels/src/components/admin_console/billing/billing_summary/upsell_card.scss
+++ b/webapp/channels/src/components/admin_console/billing/billing_summary/upsell_card.scss
@@ -31,7 +31,7 @@
             }
 
             &--more {
-                color: rgba(63, 69, 80, 0.72);
+                color: rgba(63, 69, 80, 0.75);
             }
         }
     }
@@ -58,7 +58,7 @@
 
     .disclaimer {
         margin: 5px 0;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 10px;
         font-style: normal;
         font-weight: 400;
diff --git a/webapp/channels/src/components/admin_console/billing/company_info_display.scss b/webapp/channels/src/components/admin_console/billing/company_info_display.scss
index c4b6381c1a..e98b8d6159 100644
--- a/webapp/channels/src/components/admin_console/billing/company_info_display.scss
+++ b/webapp/channels/src/components/admin_console/billing/company_info_display.scss
@@ -127,13 +127,13 @@
 .CompanyInfoDisplay__companyInfo-editButton {
     padding: 2px;
     border-radius: 4px;
-    color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+    color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     font-size: 18px;
 
     &:hover,
     &:focus {
         background: rgba(var(--sys-center-channel-color-rgb), 0.08);
-        color: rgba(var(--sys-center-channel-color-rgb), 0.72);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
         text-decoration: none;
     }
 }
diff --git a/webapp/channels/src/components/admin_console/billing/company_info_edit.scss b/webapp/channels/src/components/admin_console/billing/company_info_edit.scss
index 8e9135719a..6daade45e7 100644
--- a/webapp/channels/src/components/admin_console/billing/company_info_edit.scss
+++ b/webapp/channels/src/components/admin_console/billing/company_info_edit.scss
@@ -112,7 +112,7 @@
 
             &::placeholder {
                 color: var(--sys-center-channel-color);
-                opacity: 0.64;
+                opacity: 0.73;
             }
         }
     }
diff --git a/webapp/channels/src/components/admin_console/billing/delete_workspace/result_modal.scss b/webapp/channels/src/components/admin_console/billing/delete_workspace/result_modal.scss
index 413d71dcdd..ac34a95df8 100644
--- a/webapp/channels/src/components/admin_console/billing/delete_workspace/result_modal.scss
+++ b/webapp/channels/src/components/admin_console/billing/delete_workspace/result_modal.scss
@@ -12,7 +12,7 @@
             &:focus,
             &:active:focus {
                 background-color: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.8);
                 opacity: 1;
             }
 
@@ -21,7 +21,7 @@
             width: 24px;
             height: 24px;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56) !important;
+            color: rgba(var(--center-channel-color-rgb), 0.75) !important;
             font-family:
                 'Open Sans',
                 sans-serif;
diff --git a/webapp/channels/src/components/admin_console/billing/payment_info_display.scss b/webapp/channels/src/components/admin_console/billing/payment_info_display.scss
index 1b2cfdd966..3cdf3431d7 100644
--- a/webapp/channels/src/components/admin_console/billing/payment_info_display.scss
+++ b/webapp/channels/src/components/admin_console/billing/payment_info_display.scss
@@ -133,13 +133,13 @@
     padding: 2px;
     margin-left: 12px;
     border-radius: 4px;
-    color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+    color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     font-size: 18px;
 
     &:hover,
     &:focus {
         background: rgba(var(--sys-center-channel-color-rgb), 0.08);
-        color: rgba(var(--sys-center-channel-color-rgb), 0.72);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
         text-decoration: none;
     }
 }
diff --git a/webapp/channels/src/components/admin_console/billing/plan_details/plan_details.scss b/webapp/channels/src/components/admin_console/billing/plan_details/plan_details.scss
index f8d5c3aacf..e1c095a847 100644
--- a/webapp/channels/src/components/admin_console/billing/plan_details/plan_details.scss
+++ b/webapp/channels/src/components/admin_console/billing/plan_details/plan_details.scss
@@ -24,7 +24,7 @@
 .PlanDetails__userCount {
     display: block;
     margin-left: auto;
-    color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+    color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     font-size: 14px;
     font-weight: 600;
     line-height: 20px;
@@ -74,7 +74,7 @@
 .PlanDetails__description {
     display: flex;
     margin-top: 8px;
-    color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+    color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     font-size: 12px;
     font-weight: normal;
     line-height: 16px;
@@ -139,7 +139,7 @@
     span {
         position: relative;
         bottom: 2px;
-        color: rgba(var(--center-channel-text-rgb), 0.56);
+        color: rgba(var(--center-channel-text-rgb), 0.75);
         font-family: 'Open Sans';
         font-size: 10px;
         font-weight: 600;
diff --git a/webapp/channels/src/components/admin_console/billing/plan_details/plan_pricing.scss b/webapp/channels/src/components/admin_console/billing/plan_details/plan_pricing.scss
index 7ec2f31300..1467e37d8d 100644
--- a/webapp/channels/src/components/admin_console/billing/plan_details/plan_pricing.scss
+++ b/webapp/channels/src/components/admin_console/billing/plan_details/plan_pricing.scss
@@ -5,7 +5,7 @@
     color: var(--sys-center-channel-color);
 
     &__paid-tier {
-        color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-style: normal;
         font-weight: normal;
diff --git a/webapp/channels/src/components/admin_console/data_grid/data_grid.scss b/webapp/channels/src/components/admin_console/data_grid/data_grid.scss
index f86fab2d9a..fbfbe85596 100644
--- a/webapp/channels/src/components/admin_console/data_grid/data_grid.scss
+++ b/webapp/channels/src/components/admin_console/data_grid/data_grid.scss
@@ -104,7 +104,7 @@
                 white-space: nowrap;
 
                 .more-modal__shared-actions {
-                    color: rgba(61, 60, 64, 0.72);
+                    color: rgba(61, 60, 64, 0.75);
 
                     .shared-user-icon {
                         width: 16px;
@@ -218,7 +218,7 @@
                 margin-left: auto;
                 background: transparent;
                 border-radius: 4px;
-                color: rgba(var(--sys-center-channel-color-rgb), 0.72);
+                color: rgba(var(--sys-center-channel-color-rgb), 0.75);
                 text-decoration: none;
             }
 
diff --git a/webapp/channels/src/components/admin_console/data_retention_settings/custom_policy_form/custom_policy_form.scss b/webapp/channels/src/components/admin_console/data_retention_settings/custom_policy_form/custom_policy_form.scss
index a32cd87796..d25e1be551 100644
--- a/webapp/channels/src/components/admin_console/data_retention_settings/custom_policy_form/custom_policy_form.scss
+++ b/webapp/channels/src/components/admin_console/data_retention_settings/custom_policy_form/custom_policy_form.scss
@@ -19,11 +19,11 @@
 
     .Input_wrapper,
     .Input___info {
-        color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     }
 
     .Input::placeholder {
-        color: rgba(var(--sys-center-channel-color-rgb), 0.64);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     }
 
     .Input_fieldset {
@@ -46,7 +46,7 @@
 
     .Input_legend {
         background-color: var(--sys-center-channel-bg);
-        color: rgba(var(--sys-center-channel-color-rgb), 0.64);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     }
 }
 
diff --git a/webapp/channels/src/components/admin_console/data_retention_settings/global_policy_form/global_policy_form.scss b/webapp/channels/src/components/admin_console/data_retention_settings/global_policy_form/global_policy_form.scss
index aa8a102ae8..f0e966d331 100644
--- a/webapp/channels/src/components/admin_console/data_retention_settings/global_policy_form/global_policy_form.scss
+++ b/webapp/channels/src/components/admin_console/data_retention_settings/global_policy_form/global_policy_form.scss
@@ -19,11 +19,11 @@
 
     .Input_wrapper,
     .Input___info {
-        color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     }
 
     .Input::placeholder {
-        color: rgba(var(--sys-center-channel-color-rgb), 0.64);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     }
 
     .Input_fieldset {
@@ -46,7 +46,7 @@
 
     .Input_legend {
         background-color: var(--sys-center-channel-bg);
-        color: rgba(var(--sys-center-channel-color-rgb), 0.64);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     }
 
     .alert {
diff --git a/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.scss b/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.scss
index 0051da7c8a..4739f174c8 100644
--- a/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.scss
+++ b/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.scss
@@ -68,7 +68,7 @@
 
     &.btn-inactive {
         background: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
     }
 
     &.btn-secondary {
diff --git a/webapp/channels/src/components/admin_console/filter/filter.scss b/webapp/channels/src/components/admin_console/filter/filter.scss
index 16b3837efc..51d7a5f360 100644
--- a/webapp/channels/src/components/admin_console/filter/filter.scss
+++ b/webapp/channels/src/components/admin_console/filter/filter.scss
@@ -106,7 +106,7 @@
                 border: 1px solid rgba(var(--sys-center-channel-color-rgb), 0.16);
                 background: var(--sys-center-channel-bg);
                 border-radius: 4px;
-                color: rgba(var(--sys-center-channel-color-rgb), 0.64);
+                color: rgba(var(--sys-center-channel-color-rgb), 0.75);
                 font-size: 12px;
 
                 &:hover {
@@ -156,7 +156,7 @@
                 position: relative;
                 top: -4px;
                 margin: 0 8px 0 2px;
-                opacity: 0.64;
+                opacity: 0.73;
                 vertical-align: bottom;
 
                 &:checked {
diff --git a/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss b/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss
index acce9b4621..1c3de8e9ab 100644
--- a/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss
+++ b/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss
@@ -31,7 +31,7 @@
         }
 
         :last-child {
-            color: rgba(63, 69, 80, 0.72);
+            color: rgba(63, 69, 80, 0.64);
         }
     }
 
@@ -71,7 +71,7 @@
 
     .pre-title {
         margin-bottom: 10px;
-        color: rgba(63, 67, 80, 0.56) !important;
+        color: rgba(63, 67, 80, 0.75) !important;
         font-size: 12px;
         font-weight: 600;
         line-height: 16px;
diff --git a/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss b/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss
index 765a04b0d4..eac01bdfca 100644
--- a/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss
+++ b/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss
@@ -1,4 +1,12 @@
 .ConfirmLicenseRemovalModal {
+    .modal-header {
+        button.close {
+            span {
+                color: rgba(63, 67, 80, 0.75) !important;
+            }
+        }
+    }
+
     .modal-body {
         padding-top: 0 !important;
         padding-bottom: 40px !important;
diff --git a/webapp/channels/src/components/admin_console/license_settings/modals/ee_license_modal.scss b/webapp/channels/src/components/admin_console/license_settings/modals/ee_license_modal.scss
index ee93c7db11..01f15b9f28 100644
--- a/webapp/channels/src/components/admin_console/license_settings/modals/ee_license_modal.scss
+++ b/webapp/channels/src/components/admin_console/license_settings/modals/ee_license_modal.scss
@@ -4,7 +4,7 @@
 
         button.close {
             span {
-                color: rgba(63, 67, 80, 0.56) !important;
+                color: rgba(63, 67, 80, 0.75) !important;
             }
         }
     }
diff --git a/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss b/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss
index 7e40729b20..bbd394bd8e 100644
--- a/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss
+++ b/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss
@@ -5,7 +5,7 @@
 
         button.close {
             span {
-                color: rgba(63, 67, 80, 0.56) !important;
+                color: rgba(63, 67, 80, 0.75) !important;
             }
         }
     }
@@ -57,7 +57,7 @@
             border-radius: 4px;
 
             &__titleSection {
-                color: rgba(63, 67, 80, 0.72);
+                color: rgba(63, 67, 80, 0.75);
                 font-size: 12px;
                 font-weight: bold;
                 line-height: 16px;
diff --git a/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss b/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss
index 0103dd0178..f108b160e8 100644
--- a/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss
+++ b/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss
@@ -33,7 +33,7 @@
         }
 
         :last-child {
-            color: rgba(63, 69, 80, 0.72);
+            color: rgba(63, 69, 80, 0.64);
         }
     }
 
@@ -93,7 +93,7 @@
 
     .pre-title {
         margin-bottom: 10px;
-        color: rgba(63, 67, 80, 0.56) !important;
+        color: rgba(63, 67, 80, 0.75) !important;
         font-size: 12px;
         font-weight: 600;
         line-height: 16px;
diff --git a/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss b/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss
index 3a7ae22735..c05b56d49e 100644
--- a/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss
+++ b/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss
@@ -30,7 +30,7 @@
         }
 
         :last-child {
-            color: rgba(63, 69, 80, 0.72);
+            color: rgba(63, 69, 80, 0.64);
         }
     }
 
diff --git a/webapp/channels/src/components/admin_console/system_roles/system_role/system_role_permissions.scss b/webapp/channels/src/components/admin_console/system_roles/system_role/system_role_permissions.scss
index 3590e7fab8..eab26db151 100644
--- a/webapp/channels/src/components/admin_console/system_roles/system_role/system_role_permissions.scss
+++ b/webapp/channels/src/components/admin_console/system_roles/system_role/system_role_permissions.scss
@@ -82,7 +82,7 @@
 
                         .PermissionSectionDropdownButton_more {
                             margin-right: 8px;
-                            color: rgba(var(--sys-center-channel-color-rgb), 0.6);
+                            color: rgba(var(--sys-center-channel-color-rgb), 0.75);
                         }
 
                         .PermissionSectionDropdownButton_icon {
@@ -180,7 +180,7 @@
         }
 
         .PermissionSectionDropdownOptions_description {
-            color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+            color: rgba(var(--sys-center-channel-color-rgb), 0.75);
             font-size: 12px;
         }
     }
diff --git a/webapp/channels/src/components/admin_console/team_channel_settings/channel/details/channel_profile.scss b/webapp/channels/src/components/admin_console/team_channel_settings/channel/details/channel_profile.scss
index 772fa83f9f..d2775ca4cf 100644
--- a/webapp/channels/src/components/admin_console/team_channel_settings/channel/details/channel_profile.scss
+++ b/webapp/channels/src/components/admin_console/team_channel_settings/channel/details/channel_profile.scss
@@ -10,7 +10,7 @@
             width: 16px;
             height: 16px;
             margin-right: 4px;
-            color: rgba(61, 60, 64, 0.72);
+            color: rgba(61, 60, 64, 0.64);
             font-size: 16px;
             line-height: 16px;
 
diff --git a/webapp/channels/src/components/admin_console/team_channel_settings/team/list/team_list.scss b/webapp/channels/src/components/admin_console/team_channel_settings/team/list/team_list.scss
index 2372d3b0ed..830de6b80c 100644
--- a/webapp/channels/src/components/admin_console/team_channel_settings/team/list/team_list.scss
+++ b/webapp/channels/src/components/admin_console/team_channel_settings/team/list/team_list.scss
@@ -16,7 +16,7 @@
                     opacity: 0.8;
 
                     .archived-label {
-                        color: rgba(var(--center-channel-color-rgb), 0.64);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                     }
                 }
 
@@ -36,7 +36,7 @@
             }
 
             .TeamList_managementText {
-                opacity: 0.65;
+                opacity: 0.75;
             }
 
             .TeamList_editText {
diff --git a/webapp/channels/src/components/admin_console/workspace-optimization/dashboard.scss b/webapp/channels/src/components/admin_console/workspace-optimization/dashboard.scss
index c54f42afca..d0720477b4 100644
--- a/webapp/channels/src/components/admin_console/workspace-optimization/dashboard.scss
+++ b/webapp/channels/src/components/admin_console/workspace-optimization/dashboard.scss
@@ -212,7 +212,7 @@
                         }
 
                         svg {
-                            opacity: 0.56;
+                            opacity: 0.73;
                         }
                     }
                 }
diff --git a/webapp/channels/src/components/advanced_create_post/priority_labels.tsx b/webapp/channels/src/components/advanced_create_post/priority_labels.tsx
index a0c9c176c9..6ac7025c7d 100644
--- a/webapp/channels/src/components/advanced_create_post/priority_labels.tsx
+++ b/webapp/channels/src/components/advanced_create_post/priority_labels.tsx
@@ -69,11 +69,11 @@ const Close = styled.button`
     font-size: 17px;
     justify-content: center;
     margin-top: -1px;
-    opacity: 0.56;
+    opacity: 0.73;
     visibility: hidden;
 
     &:hover {
-        opacity: 0.72;
+        opacity: 0.73;
     }
 
     ${Priority}:hover & {
diff --git a/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.scss b/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.scss
index 2bd7f26396..be91833bbf 100644
--- a/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.scss
+++ b/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.scss
@@ -92,13 +92,13 @@
         border: none;
         background: transparent;
         border-radius: 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         cursor: pointer;
         fill: currentColor;
 
         &:hover {
             background: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.8);
             fill: currentColor;
             text-decoration: none;
         }
@@ -148,7 +148,7 @@
     &__helper-text {
         display: inline-block;
         margin: 8px 0 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-family: "Open Sans", sans-serif;
     }
 
diff --git a/webapp/channels/src/components/advanced_text_editor/formatting_bar/formatting_icon.tsx b/webapp/channels/src/components/advanced_text_editor/formatting_bar/formatting_icon.tsx
index 757b2b8ff9..983c34ef10 100644
--- a/webapp/channels/src/components/advanced_text_editor/formatting_bar/formatting_icon.tsx
+++ b/webapp/channels/src/components/advanced_text_editor/formatting_bar/formatting_icon.tsx
@@ -41,11 +41,11 @@ export const IconContainer = styled.button`
     background: transparent;
     padding: 0 7px;
     border-radius: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
 
     &:hover {
         background: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.8);
         fill: currentColor;
     }
 
diff --git a/webapp/channels/src/components/alert_banner.scss b/webapp/channels/src/components/alert_banner.scss
index 29501931c4..8bf7184a2e 100644
--- a/webapp/channels/src/components/alert_banner.scss
+++ b/webapp/channels/src/components/alert_banner.scss
@@ -135,7 +135,7 @@
     }
 
     .AlertBanner__closeButton {
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
     }
 }
 
@@ -181,6 +181,6 @@
     }
 
     .AlertBanner__closeButton {
-        color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+        color: rgba(var(--sys-center-channel-color-rgb), 0.75);
     }
 }
diff --git a/webapp/channels/src/components/analytics/true_up_review.scss b/webapp/channels/src/components/analytics/true_up_review.scss
index 97256e8a16..7a076968c0 100644
--- a/webapp/channels/src/components/analytics/true_up_review.scss
+++ b/webapp/channels/src/components/analytics/true_up_review.scss
@@ -38,7 +38,7 @@
 
     &__dueDate {
         :first-child {
-            color: rgba(var(--sys-center-channel-color-rgb), 0.64);
+            color: rgba(var(--sys-center-channel-color-rgb), 0.75);
         }
     }
 
diff --git a/webapp/channels/src/components/announcement_bar/no_internet_connection/no_internet_connection.scss b/webapp/channels/src/components/announcement_bar/no_internet_connection/no_internet_connection.scss
index 3e939c92a4..9c51c5ae00 100644
--- a/webapp/channels/src/components/announcement_bar/no_internet_connection/no_internet_connection.scss
+++ b/webapp/channels/src/components/announcement_bar/no_internet_connection/no_internet_connection.scss
@@ -18,7 +18,7 @@
 
     .noInternetConnection__contactSupport,
     .noInternetConnection__emailUs {
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 16px;
         font-style: normal;
         font-weight: normal;
diff --git a/webapp/channels/src/components/app_bar/app_bar.scss b/webapp/channels/src/components/app_bar/app_bar.scss
index d00af190b3..0b2d1648b3 100644
--- a/webapp/channels/src/components/app_bar/app_bar.scss
+++ b/webapp/channels/src/components/app_bar/app_bar.scss
@@ -105,11 +105,11 @@ $app-bar-width: 48px;
             }
 
             .app-bar__old-icon {
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
 
                 &:hover,
                 &--active {
-                    color: rgba(var(--center-channel-color-rgb), 0.72);
+                    color: rgba(var(--center-channel-color-rgb), 0.8);
                 }
             }
 
diff --git a/webapp/channels/src/components/apps_form/apps_form_component.scss b/webapp/channels/src/components/apps_form/apps_form_component.scss
index f4f54fe9f0..86a97db277 100644
--- a/webapp/channels/src/components/apps_form/apps_form_component.scss
+++ b/webapp/channels/src/components/apps_form/apps_form_component.scss
@@ -48,7 +48,7 @@
         align-items: center;
         justify-content: center;
         fill: v(center-channel-color);
-        opacity: 0.56;
+        opacity: 0.73;
 
         &--large {
             width: 2.4rem;
diff --git a/webapp/channels/src/components/autosize_textarea.tsx b/webapp/channels/src/components/autosize_textarea.tsx
index 45183b55a6..91b7619046 100644
--- a/webapp/channels/src/components/autosize_textarea.tsx
+++ b/webapp/channels/src/components/autosize_textarea.tsx
@@ -32,7 +32,7 @@ const styles = {
     placeholder: {
         overflow: 'hidden',
         textOverflow: 'ellipsis',
-        opacity: 0.5,
+        opacity: 0.75,
         pointerEvents: 'none' as const,
         position: 'absolute' as const,
         whiteSpace: 'nowrap' as const,
diff --git a/webapp/channels/src/components/browse_channels/browse_channels.scss b/webapp/channels/src/components/browse_channels/browse_channels.scss
index db16ac0eee..b6d76c1c76 100644
--- a/webapp/channels/src/components/browse_channels/browse_channels.scss
+++ b/webapp/channels/src/components/browse_channels/browse_channels.scss
@@ -21,9 +21,8 @@
 
         #searchIcon {
             position: absolute;
-            z-index: 1;
-            top: 15px;
-            left: 42px;
+            top: 16px;
+            left: 46px;
             color: rgba(var(--center-channel-color-rgb), 0.64);
             pointer-events: none;
         }
@@ -54,7 +53,7 @@
         margin: 0;
 
         span {
-            color: rgba(var(--center-channel-color-rgb), 0.64);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             line-height: 16px;
         }
@@ -119,7 +118,7 @@
 
             .more-modal__details {
                 padding-left: 0;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
 
                 svg {
                     flex-shrink: 0;
@@ -144,7 +143,7 @@
                         width: 3px;
                         height: 3px;
                         flex-shrink: 0;
-                        background-color: rgba(var(--center-channel-color-rgb), 0.56);
+                        background-color: rgba(var(--center-channel-color-rgb), 0.75);
                         border-radius: 50%;
                     }
 
diff --git a/webapp/channels/src/components/category_modal.scss b/webapp/channels/src/components/category_modal.scss
index 6e67fa8340..e10f71c01d 100644
--- a/webapp/channels/src/components/category_modal.scss
+++ b/webapp/channels/src/components/category_modal.scss
@@ -1,7 +1,7 @@
 @charset 'UTF-8';
 
 .edit-category__helpText {
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 12px;
     line-height: 40px;
 }
diff --git a/webapp/channels/src/components/center_message_lock/index.scss b/webapp/channels/src/components/center_message_lock/index.scss
index bfbe289789..5630f31d4f 100644
--- a/webapp/channels/src/components/center_message_lock/index.scss
+++ b/webapp/channels/src/components/center_message_lock/index.scss
@@ -15,7 +15,7 @@
     }
 
     &__icon {
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
     }
 
     &__title {
diff --git a/webapp/channels/src/components/center_message_lock/index.tsx b/webapp/channels/src/components/center_message_lock/index.tsx
index 49c4729a06..97807dddb8 100644
--- a/webapp/channels/src/components/center_message_lock/index.tsx
+++ b/webapp/channels/src/components/center_message_lock/index.tsx
@@ -149,7 +149,7 @@ export default function CenterMessageLock(props: Props) {
 
     return (<div className='CenterMessageLock'>
         <div className='CenterMessageLock__left'>
-            <EyeOffOutlineIcon color={'rgba(var(--center-channel-color-rgb), 0.72)'}/>
+            <EyeOffOutlineIcon color={'rgba(var(--center-channel-color-rgb), 0.75)'}/>
         </div>
         <div className='CenterMessageLock__right'>
             <div className='CenterMessageLock__title'>
diff --git a/webapp/channels/src/components/channel_info_rhs/about_area.tsx b/webapp/channels/src/components/channel_info_rhs/about_area.tsx
index af0a325e7f..b5d5d4a7ee 100644
--- a/webapp/channels/src/components/channel_info_rhs/about_area.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/about_area.tsx
@@ -30,7 +30,7 @@ const Container = styled.div`
         padding: 0px;
         background: transparent;
         border: 0px;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
     }
 `;
 
diff --git a/webapp/channels/src/components/channel_info_rhs/about_area_channel.tsx b/webapp/channels/src/components/channel_info_rhs/about_area_channel.tsx
index e2c76acb89..baf1478a8b 100644
--- a/webapp/channels/src/components/channel_info_rhs/about_area_channel.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/about_area_channel.tsx
@@ -17,7 +17,7 @@ const ChannelId = styled.div`
     font-size: 11px;
     line-height: 16px;
     letter-spacing: 0.02em;
-    color: rgba(var(--center-channel-color-rgb), .64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 const ChannelPurpose = styled.div`
diff --git a/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx b/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx
index 9f61307734..cecb989b93 100644
--- a/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx
@@ -73,7 +73,7 @@ const ChannelId = styled.div`
     font-size: 11px;
     line-height: 16px;
     letter-spacing: 0.02em;
-    color: rgba(var(--center-channel-color-rgb), .64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 interface Props {
diff --git a/webapp/channels/src/components/channel_info_rhs/about_area_gm.tsx b/webapp/channels/src/components/channel_info_rhs/about_area_gm.tsx
index 681a1048c2..15bdbf2a22 100644
--- a/webapp/channels/src/components/channel_info_rhs/about_area_gm.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/about_area_gm.tsx
@@ -60,7 +60,7 @@ const ChannelId = styled.div`
     font-size: 11px;
     line-height: 16px;
     letter-spacing: 0.02em;
-    color: rgba(var(--center-channel-color-rgb), .64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 interface Props {
diff --git a/webapp/channels/src/components/channel_info_rhs/components/editable_area.tsx b/webapp/channels/src/components/channel_info_rhs/components/editable_area.tsx
index 51433f38d1..a2cd1663df 100644
--- a/webapp/channels/src/components/channel_info_rhs/components/editable_area.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/components/editable_area.tsx
@@ -11,10 +11,10 @@ const EditButton = styled.button`
     padding: 0px;
     border-radius: 4px;
     background: rgba(var(--center-channel-color-rgb), 0.04);
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     &:hover {
         background: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
     }
     width: 24px;
     height: 24px;
@@ -27,14 +27,14 @@ const EmptyPlace = styled.button`
     padding: 0px;
     background: transparent;
     border: 0px;
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     i {
         display: none;
         font-size: 14px;
         margin-left: 4px;
     }
     &:hover {
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         i {
             display: inline-block;
         }
diff --git a/webapp/channels/src/components/channel_info_rhs/menu.tsx b/webapp/channels/src/components/channel_info_rhs/menu.tsx
index eaa4d4f6e3..3c4ac145a7 100644
--- a/webapp/channels/src/components/channel_info_rhs/menu.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/menu.tsx
@@ -18,7 +18,7 @@ const MenuItemContainer = styled.div`
 `;
 
 const Icon = styled.div`
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
 `;
 
 const MenuItemText = styled.div`
@@ -28,7 +28,7 @@ const MenuItemText = styled.div`
 
 const RightSide = styled.div`
     display: flex;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 const Badge = styled.div`
diff --git a/webapp/channels/src/components/channel_info_rhs/top_buttons.tsx b/webapp/channels/src/components/channel_info_rhs/top_buttons.tsx
index 9ebacce06f..ac4cbe620d 100644
--- a/webapp/channels/src/components/channel_info_rhs/top_buttons.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/top_buttons.tsx
@@ -11,37 +11,47 @@ import Constants from 'utils/constants';
 
 const ChannelInfoRhsTopButtons = styled.div`
     display: flex;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     margin-top: 24px;
     padding: 0 18px;
 `;
 
 const Button = styled.button`
-    border-radius: 4px;
-    border: 0;
-    padding: 12px 0 10px 0;
-    background: rgba(var(--center-channel-color-rgb), 0.04);
     flex: 1;
+    padding: 12px 0 10px 0;
+    border: 0;
     margin: 0 6px;
+    background: rgba(var(--center-channel-color-rgb), 0.04);
+    border-radius: 4px;
 
     &:hover {
-       background: rgba(var(--center-channel-color-rgb), 0.08);
-       color: rgba(var(--center-channel-color-rgb), 0.72);
+        background: rgba(var(--center-channel-color-rgb), 0.08);
+        color: rgba(var(--center-channel-color-rgb), 0.8);
+
+        & i {
+            color: rgba(var(--center-channel-color-rgb), 0.8);
+        }
     }
 
     &:active,
     &.active {
         background: rgba(var(--button-bg-rgb), 0.08);
         color: var(--button-bg);
+
+        & i {
+            color: var(--button-bg-rgb);
+        }
     }
 
     & i {
+        color: rgba(var(--center-channel-color-rgb), 0.64);
         font-size: 24px;
     }
+
     & span {
-        line-height: 16px;
         font-size: 10px;
         font-weight: 600;
+        line-height: 16px;
     }
 `;
 
@@ -51,7 +61,7 @@ const CopyButton = styled(Button)`
     &:active,
     &.active {
         background: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         transition: none;
     }
 
diff --git a/webapp/channels/src/components/channel_members_rhs/channel_members_rhs.tsx b/webapp/channels/src/components/channel_members_rhs/channel_members_rhs.tsx
index 7693113863..1c35a66f87 100644
--- a/webapp/channels/src/components/channel_members_rhs/channel_members_rhs.tsx
+++ b/webapp/channels/src/components/channel_members_rhs/channel_members_rhs.tsx
@@ -303,7 +303,7 @@ const MemberListSeparator = styled.div`
     letter-spacing: 0.02em;
     text-transform: uppercase;
     padding: 0px 12px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     margin-top: 16px;
 `;
 
diff --git a/webapp/channels/src/components/channel_members_rhs/member.tsx b/webapp/channels/src/components/channel_members_rhs/member.tsx
index b305966357..452d4ae60e 100644
--- a/webapp/channels/src/components/channel_members_rhs/member.tsx
+++ b/webapp/channels/src/components/channel_members_rhs/member.tsx
@@ -52,7 +52,7 @@ const DisplayName = styled.span`
 
 const Username = styled.span`
     margin-left: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 12px;
     line-height: 18px;
 `;
@@ -72,7 +72,7 @@ const SendMessage = styled.button`
     }
 
     .icon {
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
         font-size: 14.4px;
     };
 `;
@@ -247,7 +247,7 @@ export default styled(Member)`
 
     &:hover {
         background: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
 
         ${SendMessage} {
             display: block;
diff --git a/webapp/channels/src/components/cloud_invoice_preview/cloud_invoice_preview.scss b/webapp/channels/src/components/cloud_invoice_preview/cloud_invoice_preview.scss
index ee04981378..bf97995f27 100644
--- a/webapp/channels/src/components/cloud_invoice_preview/cloud_invoice_preview.scss
+++ b/webapp/channels/src/components/cloud_invoice_preview/cloud_invoice_preview.scss
@@ -16,7 +16,7 @@
         .close {
             margin-top: auto;
             margin-bottom: auto;
-            color: rgba(#3f4350, 0.56) !important;
+            color: rgba(#3f4350, 0.75) !important;
         }
 
         .modal-title {
@@ -29,7 +29,7 @@
 
         .subtitle {
             margin-top: 10px;
-            color: rgba(#3d3c40, 0.72);
+            color: rgba(#3d3c40, 0.75);
             font-family: 'Metropolis';
             font-size: 14px;
             font-style: normal;
diff --git a/webapp/channels/src/components/cloud_start_trial/request_business_email_modal.scss b/webapp/channels/src/components/cloud_start_trial/request_business_email_modal.scss
index 9c69c311bb..f59c6dca16 100644
--- a/webapp/channels/src/components/cloud_start_trial/request_business_email_modal.scss
+++ b/webapp/channels/src/components/cloud_start_trial/request_business_email_modal.scss
@@ -23,7 +23,7 @@
             &:focus,
             &:active:focus {
                 background-color: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.8);
                 opacity: 1;
             }
 
@@ -32,7 +32,7 @@
             width: 4rem;
             height: 4rem;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56) !important;
+            color: rgba(var(--center-channel-color-rgb), 0.75) !important;
             font-family:
                 'Open Sans',
                 sans-serif;
diff --git a/webapp/channels/src/components/cloud_usage_modal/limit_line.scss b/webapp/channels/src/components/cloud_usage_modal/limit_line.scss
index 03de9103c9..10357b206e 100644
--- a/webapp/channels/src/components/cloud_usage_modal/limit_line.scss
+++ b/webapp/channels/src/components/cloud_usage_modal/limit_line.scss
@@ -19,7 +19,7 @@
         flex-grow: 1;
         padding-right: 24px;
         padding-left: 12px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
 
         &:first-child {
             padding-left: 0;
diff --git a/webapp/channels/src/components/common/chip/chip.tsx b/webapp/channels/src/components/common/chip/chip.tsx
index 9e7a904be5..fe15fdf611 100644
--- a/webapp/channels/src/components/common/chip/chip.tsx
+++ b/webapp/channels/src/components/common/chip/chip.tsx
@@ -41,7 +41,7 @@ const StyledChip = styled.button<{ otherOption?: boolean }>`
     border-radius: 16px;
 
     background-color: var(--center-channel-bg);
-    ${(p) => (p.otherOption ? 'color: rgba(var(--center-channel-color-rgb), 0.72);' : '')}
+    ${(p) => (p.otherOption ? 'color: rgba(var(--center-channel-color-rgb), 0.75);' : '')}
 
     &:hover {
         background-color: rgba(var(--center-channel-color-rgb), 0.08);
diff --git a/webapp/channels/src/components/custom_status/custom_status.scss b/webapp/channels/src/components/custom_status/custom_status.scss
index 08d02e43a2..73a3d69cdc 100644
--- a/webapp/channels/src/components/custom_status/custom_status.scss
+++ b/webapp/channels/src/components/custom_status/custom_status.scss
@@ -2,7 +2,7 @@
     position: absolute;
     top: 16px;
     right: 20px;
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     opacity: 1;
 }
 
@@ -53,7 +53,7 @@
 
             button.dateTime__calendar-icon {
                 margin: 0 8px 0 0;
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
             }
 
             input#customStatus__calendar-input {
@@ -107,13 +107,13 @@
         border: none;
         background: transparent;
         border-radius: 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
-        fill: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
+        fill: rgba(var(--center-channel-color-rgb), 0.64);
 
         &:hover {
             background: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
-            fill: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.8);
+            fill: rgba(var(--center-channel-color-rgb), 0.8);
         }
 
         &:active,
@@ -150,7 +150,7 @@
 .status-dropdown-menu,
 .StatusModal__input {
     .input-clear-x {
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
 
         .icon {
             font-size: 20px;
@@ -249,7 +249,7 @@
 
     &__duration {
         margin-left: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 14px;
         font-weight: 400;
         line-height: 14px;
@@ -351,7 +351,7 @@ span.emoticon[style]:hover {
             left: 12px;
             padding: 0 4px;
             background: var(--center-channel-bg);
-            color: rgba(var(--center-channel-color-rgb), 0.64);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 10px;
             letter-spacing: 0.03em;
             line-height: 16px;
diff --git a/webapp/channels/src/components/date_picker/date_picker.scss b/webapp/channels/src/components/date_picker/date_picker.scss
index cac3a51c5c..1dc8d68db0 100644
--- a/webapp/channels/src/components/date_picker/date_picker.scss
+++ b/webapp/channels/src/components/date_picker/date_picker.scss
@@ -26,7 +26,7 @@
     }
 
     .rdp-head_cell {
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-family: 'Open Sans';
         font-size: 12px;
         font-style: normal;
@@ -83,7 +83,7 @@
 
         &.rdp-nav_button {
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
 
             &_previous {
                 margin-right: 8px;
@@ -97,7 +97,7 @@
 
             &:hover {
                 background-color: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
             }
 
             &:active {
diff --git a/webapp/channels/src/components/desktop_auth_token.scss b/webapp/channels/src/components/desktop_auth_token.scss
index 73342bca94..d10364dc9d 100644
--- a/webapp/channels/src/components/desktop_auth_token.scss
+++ b/webapp/channels/src/components/desktop_auth_token.scss
@@ -22,7 +22,7 @@
 
 .DesktopAuthToken__sub {
     margin-bottom: 24px;
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 18px;
     line-height: 28px;
 
diff --git a/webapp/channels/src/components/dnd_custom_time_picker_modal/dnd_custom_time_picker_modal.scss b/webapp/channels/src/components/dnd_custom_time_picker_modal/dnd_custom_time_picker_modal.scss
index 96d8f33ecc..f4bc81f8b4 100644
--- a/webapp/channels/src/components/dnd_custom_time_picker_modal/dnd_custom_time_picker_modal.scss
+++ b/webapp/channels/src/components/dnd_custom_time_picker_modal/dnd_custom_time_picker_modal.scss
@@ -104,7 +104,7 @@
     padding: 0 4px;
     margin: 0 14px;
     background: rgba(var(--center-channel-bg-rgb), 1);
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 10px;
 }
 
@@ -126,7 +126,7 @@
 
         button.dateTime__calendar-icon {
             margin: 0 8px 0 0;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
 
             &:active {
                 background-color: transparent;
diff --git a/webapp/channels/src/components/drafts/draft_actions/action.scss b/webapp/channels/src/components/drafts/draft_actions/action.scss
index 6f0caaaea5..c97af89058 100644
--- a/webapp/channels/src/components/drafts/draft_actions/action.scss
+++ b/webapp/channels/src/components/drafts/draft_actions/action.scss
@@ -31,12 +31,12 @@
     }
 
     .icon {
-        color: rgba(var(--center-channel-color-rgb), 0.56);
-        fill: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
+        fill: rgba(var(--center-channel-color-rgb), 0.64);
 
         &:hover {
-            color: rgba(var(--center-channel-color-rgb), 0.72);
-            fill: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.8);
+            fill: rgba(var(--center-channel-color-rgb), 0.8);
         }
     }
 
diff --git a/webapp/channels/src/components/drafts/drafts_link/drafts_link.scss b/webapp/channels/src/components/drafts/drafts_link/drafts_link.scss
index 59f0c83304..e228d3b988 100644
--- a/webapp/channels/src/components/drafts/drafts_link/drafts_link.scss
+++ b/webapp/channels/src/components/drafts/drafts_link/drafts_link.scss
@@ -11,7 +11,7 @@
 
         .icon {
             svg {
-                fill: rgba(var(--sidebar-text-rgb), 0.6);
+                fill: rgba(var(--sidebar-text-rgb), 0.75);
                 vertical-align: middle;
             }
         }
@@ -43,7 +43,7 @@
         margin-top: 1px;
 
         svg {
-            fill: rgba(var(--sidebar-text-rgb), 0.6);
+            fill: rgba(var(--sidebar-text-rgb), 0.75);
         }
     }
 
diff --git a/webapp/channels/src/components/drafts/panel/panel_header.scss b/webapp/channels/src/components/drafts/panel/panel_header.scss
index 1ac5f65c77..c744e6509e 100644
--- a/webapp/channels/src/components/drafts/panel/panel_header.scss
+++ b/webapp/channels/src/components/drafts/panel/panel_header.scss
@@ -6,7 +6,7 @@
     justify-content: space-between;
     padding: 0 16px;
     border-bottom: 1px solid rgba(var(--center-channel-color-rgb), 0.08);
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 12px;
     line-height: 16px;
 
@@ -47,7 +47,7 @@
 
     &__timestamp {
         padding-right: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         vertical-align: middle;
     }
 
diff --git a/webapp/channels/src/components/emoji_picker/components/emoji_picker_skin.tsx b/webapp/channels/src/components/emoji_picker/components/emoji_picker_skin.tsx
index 74221cb820..6398d13334 100644
--- a/webapp/channels/src/components/emoji_picker/components/emoji_picker_skin.tsx
+++ b/webapp/channels/src/components/emoji_picker/components/emoji_picker_skin.tsx
@@ -102,7 +102,7 @@ export class EmojiPickerSkin extends React.PureComponent<Props, State> {
                     >
                         <CloseIcon
                             size={16}
-                            color={'rgba(var(--center-channel-color-rgb), 0.56)'}
+                            color={'rgba(var(--center-channel-color-rgb), 0.75)'}
                         />
                     </button>
                     <div className='skin-tones__close-text'>
diff --git a/webapp/channels/src/components/external_login_button/external_login_button.scss b/webapp/channels/src/components/external_login_button/external_login_button.scss
index b79151e9be..c0917b904e 100644
--- a/webapp/channels/src/components/external_login_button/external_login_button.scss
+++ b/webapp/channels/src/components/external_login_button/external_login_button.scss
@@ -10,7 +10,7 @@
     min-width: 136px;
     flex: 1 1 0%;
     border-color: rgba(var(--center-channel-color-rgb), 0.16);
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     text-decoration: none;
 
     &.direction-column {
diff --git a/webapp/channels/src/components/feature_restricted_modal/feature_restricted_modal.scss b/webapp/channels/src/components/feature_restricted_modal/feature_restricted_modal.scss
index c8ae22d8e0..a7ba99330d 100644
--- a/webapp/channels/src/components/feature_restricted_modal/feature_restricted_modal.scss
+++ b/webapp/channels/src/components/feature_restricted_modal/feature_restricted_modal.scss
@@ -13,7 +13,7 @@
 
     &__terms {
         padding-top: 14px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-weight: 400;
         line-height: 16px;
diff --git a/webapp/channels/src/components/file_preview_modal/file_preview_modal.scss b/webapp/channels/src/components/file_preview_modal/file_preview_modal.scss
index f935da6b97..b9e215aad7 100644
--- a/webapp/channels/src/components/file_preview_modal/file_preview_modal.scss
+++ b/webapp/channels/src/components/file_preview_modal/file_preview_modal.scss
@@ -58,7 +58,7 @@
 
     &__zoom-bar {
         .modal .modal-image & {
-            background-color: rgba(61, 60, 64, 0.56);
+            background-color: rgba(61, 60, 64, 0.75);
         }
     }
 
diff --git a/webapp/channels/src/components/file_preview_modal/file_preview_modal_info/file_preview_modal_info.scss b/webapp/channels/src/components/file_preview_modal/file_preview_modal_info/file_preview_modal_info.scss
index 8b288b2265..5b739c4e10 100644
--- a/webapp/channels/src/components/file_preview_modal/file_preview_modal_info/file_preview_modal_info.scss
+++ b/webapp/channels/src/components/file_preview_modal/file_preview_modal_info/file_preview_modal_info.scss
@@ -36,7 +36,7 @@
     &__file-details {
         overflow: hidden;
         max-width: 30vw;
-        color: rgba(255, 255, 255, 0.56);
+        color: rgba(255, 255, 255, 0.75);
         font-size: 1.4rem;
         font-weight: 400;
         text-overflow: ellipsis;
diff --git a/webapp/channels/src/components/file_search_results/file_search_result_item.scss b/webapp/channels/src/components/file_search_results/file_search_result_item.scss
index 0a8b3d8502..eb0b76bcb4 100644
--- a/webapp/channels/src/components/file_search_results/file_search_result_item.scss
+++ b/webapp/channels/src/components/file_search_results/file_search_result_item.scss
@@ -71,7 +71,7 @@
             gap: 8px;
 
             > :not(.Tag) {
-                opacity: 0.56;
+                opacity: 0.73;
             }
 
             .Tag {
@@ -93,9 +93,9 @@
         margin-left: 8px;
         background-color: var(--center-channel-bg);
         border-radius: 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
         cursor: pointer;
-        fill: rgba(var(--center-channel-color-rgb), 0.72);
+        fill: rgba(var(--center-channel-color-rgb), 0.64);
         opacity: 0;
         text-decoration: none;
         transition: opacity 0.15s ease;
@@ -110,7 +110,7 @@
 
         &:hover {
             background-color: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.8);
         }
     }
 
diff --git a/webapp/channels/src/components/forward_post_modal/forward_post_channel_select.tsx b/webapp/channels/src/components/forward_post_modal/forward_post_channel_select.tsx
index fe8cd3101f..2124761408 100644
--- a/webapp/channels/src/components/forward_post_modal/forward_post_channel_select.tsx
+++ b/webapp/channels/src/components/forward_post_modal/forward_post_channel_select.tsx
@@ -75,7 +75,7 @@ const FormattedOption = (props: ChannelOption & {className: string; isSingleValu
     let icon;
     const iconProps = {
         size: 16,
-        color: 'rgba(var(--center-channel-color-rgb), 0.56)',
+        color: 'rgba(var(--center-channel-color-rgb), 0.75)',
     };
 
     if (channelIsArchived) {
@@ -216,7 +216,7 @@ const DropdownIndicator = (props: IndicatorProps<ChannelOption>) => {
         <components.DropdownIndicator {...props}>
             <ChevronDownIcon
                 size={16}
-                color={'rgba(var(--center-channel-color-rgb), 0.64)'}
+                color={'rgba(var(--center-channel-color-rgb), 0.75)'}
             />
         </components.DropdownIndicator>
     );
diff --git a/webapp/channels/src/components/forward_post_modal/forward_post_channel_select_styles.tsx b/webapp/channels/src/components/forward_post_modal/forward_post_channel_select_styles.tsx
index 7daf577888..c9da460c32 100644
--- a/webapp/channels/src/components/forward_post_modal/forward_post_channel_select_styles.tsx
+++ b/webapp/channels/src/components/forward_post_modal/forward_post_channel_select_styles.tsx
@@ -27,7 +27,7 @@ const getBaseStyles = (bodyHeight: number) => {
         placeholder: (provided: CSSProperties): CSSPropertiesWithPseudos => ({
             ...provided,
             margin: 0,
-            color: 'rgba(var(--center-channel-color-rgb), 0.64)',
+            color: 'rgba(var(--center-channel-color-rgb), 0.75)',
             fontSize: '14px',
             lineHeight: '20px',
         }),
@@ -120,7 +120,7 @@ const getBaseStyles = (bodyHeight: number) => {
             justifyContent: 'flex-start',
             padding: '0 0 0 2rem',
             margin: 0,
-            color: 'rgba(var(--center-channel-color-rgb), 0.56)',
+            color: 'rgba(var(--center-channel-color-rgb), 0.75)',
             backgroundColor: 'none',
             fontSize: '1.2rem',
             fontWeight: 600,
diff --git a/webapp/channels/src/components/forward_post_modal/forward_post_modal.scss b/webapp/channels/src/components/forward_post_modal/forward_post_modal.scss
index 9b71d93a08..cc85db09d9 100644
--- a/webapp/channels/src/components/forward_post_modal/forward_post_modal.scss
+++ b/webapp/channels/src/components/forward_post_modal/forward_post_modal.scss
@@ -84,7 +84,7 @@
                 }
 
                 &--description {
-                    color: rgba(var(--center-channel-color-rgb), 0.56);
+                    color: rgba(var(--center-channel-color-rgb), 0.75);
                 }
 
                 .emoticon {
@@ -95,7 +95,7 @@
             &__team-name {
                 overflow: hidden;
                 width: 100%;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 grid-column: 3 / 4;
                 text-align: right;
                 text-overflow: ellipsis;
@@ -138,7 +138,7 @@
             box-shadow: none;
 
             &#forward_post_textbox_placeholder {
-                opacity: 0.64 !important;
+                opacity: 0.73 !important;
             }
         }
 
diff --git a/webapp/channels/src/components/header_footer_route/content_layouts/column.scss b/webapp/channels/src/components/header_footer_route/content_layouts/column.scss
index 5da4fc3651..614c779d67 100644
--- a/webapp/channels/src/components/header_footer_route/content_layouts/column.scss
+++ b/webapp/channels/src/components/header_footer_route/content_layouts/column.scss
@@ -24,7 +24,7 @@
     }
 
     .content-layout-column-message {
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 16px;
         font-weight: 400;
         line-height: 24px;
diff --git a/webapp/channels/src/components/header_footer_route/footer.scss b/webapp/channels/src/components/header_footer_route/footer.scss
index 1892297c36..ef3daac03e 100644
--- a/webapp/channels/src/components/header_footer_route/footer.scss
+++ b/webapp/channels/src/components/header_footer_route/footer.scss
@@ -17,7 +17,7 @@
     .footer-link {
         @include link;
 
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 11px;
         font-weight: 400;
         line-height: 16px;
@@ -29,7 +29,7 @@
 
     .footer-copyright {
         margin-right: 24px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 11px;
         line-height: 16px;
     }
diff --git a/webapp/channels/src/components/hint-toast/hint_toast.scss b/webapp/channels/src/components/hint-toast/hint_toast.scss
index 7c31752e01..36cdda5cd6 100644
--- a/webapp/channels/src/components/hint-toast/hint_toast.scss
+++ b/webapp/channels/src/components/hint-toast/hint_toast.scss
@@ -29,13 +29,12 @@
             background-color: var(--center-channel-bg);
 
             svg {
-                fill: rgba(var(--center-channel-color-rgb), 0.72);
+                fill: rgba(var(--center-channel-color-rgb), 0.75);
             }
         }
 
         svg {
-            padding-top: 2px; /* Vertical alignment fix */
-            fill: rgba(var(--center-channel-color-rgb), 0.56);
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
             vertical-align: middle;
         }
 
diff --git a/webapp/channels/src/components/invitation_modal/add_to_channels.scss b/webapp/channels/src/components/invitation_modal/add_to_channels.scss
index 09636f49f3..22293d10d9 100644
--- a/webapp/channels/src/components/invitation_modal/add_to_channels.scss
+++ b/webapp/channels/src/components/invitation_modal/add_to_channels.scss
@@ -5,7 +5,7 @@
         width: 100%;
         height: 90px;
         padding: 12px;
-        border: 1px solid rgba(var(--center-channel-color-rgb), 0.64);
+        border: 1px solid rgba(var(--center-channel-color-rgb), 0.75);
         margin-bottom: 8px;
         background: var(--center-channel-bg);
         border-radius: 4px;
@@ -20,7 +20,7 @@
     .help-text {
         // override default from _inputs.scss
         margin: 0;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
     }
 
     &__customMessage {
@@ -41,7 +41,7 @@
 
         svg {
             &:hover {
-                fill: rgba(var(--center-channel-color-rgb), 0.56);
+                fill: rgba(var(--center-channel-color-rgb), 0.75);
             }
 
             position: relative;
@@ -49,7 +49,7 @@
             width: 24px;
             height: 24px;
             cursor: pointer;
-            fill: rgba(var(--center-channel-color-rgb), 0.64);
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         .help-text {
diff --git a/webapp/channels/src/components/invitation_modal/invite_as.scss b/webapp/channels/src/components/invitation_modal/invite_as.scss
index 52738ed928..e69478b188 100644
--- a/webapp/channels/src/components/invitation_modal/invite_as.scss
+++ b/webapp/channels/src/components/invitation_modal/invite_as.scss
@@ -23,7 +23,7 @@
         }
 
         .disabled-legend {
-            opacity: 0.6;
+            opacity: 0.73;
         }
 
         // TODO@UI
diff --git a/webapp/channels/src/components/invitation_modal/invite_view.scss b/webapp/channels/src/components/invitation_modal/invite_view.scss
index bc23277679..25a378fd1a 100644
--- a/webapp/channels/src/components/invitation_modal/invite_view.scss
+++ b/webapp/channels/src/components/invitation_modal/invite_view.scss
@@ -31,7 +31,7 @@
     }
 
     &__sectionTitleParenthetical {
-        color: rgba(var(--center-channel-color-rgb), 0.6);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-weight: normal;
     }
 }
diff --git a/webapp/channels/src/components/invitation_modal/no_permissions_view.scss b/webapp/channels/src/components/invitation_modal/no_permissions_view.scss
index 0ea14393a2..7193958f33 100644
--- a/webapp/channels/src/components/invitation_modal/no_permissions_view.scss
+++ b/webapp/channels/src/components/invitation_modal/no_permissions_view.scss
@@ -16,7 +16,7 @@
             appearance: none;
             background: none;
             color: inherit;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
             cursor: pointer;
             font: inherit;
             font-size: 24px;
diff --git a/webapp/channels/src/components/invitation_modal/result_table.scss b/webapp/channels/src/components/invitation_modal/result_table.scss
index 2d6c99ceb2..3a67f39986 100644
--- a/webapp/channels/src/components/invitation_modal/result_table.scss
+++ b/webapp/channels/src/components/invitation_modal/result_table.scss
@@ -99,7 +99,7 @@
 .invitation-modal-confirm {
     h2 {
         margin-bottom: 13px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 14px;
         font-weight: 600;
     }
diff --git a/webapp/channels/src/components/learn_more_trial_modal/learn_more_trial_modal_step.scss b/webapp/channels/src/components/learn_more_trial_modal/learn_more_trial_modal_step.scss
index f2b39add50..87db4c2fd1 100644
--- a/webapp/channels/src/components/learn_more_trial_modal/learn_more_trial_modal_step.scss
+++ b/webapp/channels/src/components/learn_more_trial_modal/learn_more_trial_modal_step.scss
@@ -48,7 +48,7 @@
             width: 90%;
             height: 32px;
             margin-top: 15px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-family: "Open Sans";
             font-size: 12px;
             font-style: normal;
@@ -60,7 +60,7 @@
             position: fixed;
             bottom: 24px;
             left: 24px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             font-style: normal;
             font-weight: normal;
diff --git a/webapp/channels/src/components/login/login.scss b/webapp/channels/src/components/login/login.scss
index 1dbe2f0773..11db02891f 100644
--- a/webapp/channels/src/components/login/login.scss
+++ b/webapp/channels/src/components/login/login.scss
@@ -30,7 +30,7 @@
         justify-content: center;
 
         .login-body-message-subtitle {
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 18px;
             font-weight: 400;
             line-height: 28px;
@@ -167,7 +167,7 @@
                     .login-body-card-form-divider-label {
                         padding: 0 10px;
                         background-color: var(--center-channel-bg);
-                        color: rgba(var(--center-channel-color-rgb), 0.56);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         font-size: 12px;
                         line-height: 0;
                     }
@@ -210,7 +210,7 @@
             p {
                 width: 100%;
                 margin: 0;
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 18px;
                 font-weight: 400;
                 line-height: 28px;
diff --git a/webapp/channels/src/components/markdown_image_expand/markdown_image_expand.scss b/webapp/channels/src/components/markdown_image_expand/markdown_image_expand.scss
index 4ece07d4da..f9c20027c0 100644
--- a/webapp/channels/src/components/markdown_image_expand/markdown_image_expand.scss
+++ b/webapp/channels/src/components/markdown_image_expand/markdown_image_expand.scss
@@ -19,7 +19,7 @@
     background-color: var(--center-channel-bg);
     border-radius: 16px;
     box-shadow: $elevation-1;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     font-size: 18px;
     line-height: 21px;
 
@@ -50,12 +50,12 @@
     border: none;
     background: transparent;
     border-radius: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     font-size: 18px;
     line-height: 18px;
 
     &:hover {
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.8);
     }
 
     .icon {
diff --git a/webapp/channels/src/components/menu/menu_item.tsx b/webapp/channels/src/components/menu/menu_item.tsx
index ea82e2ef28..44660d0980 100644
--- a/webapp/channels/src/components/menu/menu_item.tsx
+++ b/webapp/channels/src/components/menu/menu_item.tsx
@@ -240,10 +240,10 @@ export const MenuItemStyled = styled(MuiMenuItem, {
                     width: '18px',
                     height: '18px',
                     marginInlineEnd: '10px',
-                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.56)' : 'var(--error-text)',
+                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.64)' : 'var(--error-text)',
                 },
                 '&:hover .leading-element': {
-                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.72)' : 'var(--button-color)',
+                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.8)' : 'var(--button-color)',
                 },
 
                 '&>.label-elements': {
@@ -262,7 +262,7 @@ export const MenuItemStyled = styled(MuiMenuItem, {
 
                 '&>.label-elements>:last-child': {
                     fontSize: '12px',
-                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.56)' : 'var(--error-text)',
+                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.75)' : 'var(--error-text)',
                 },
                 '&:hover .label-elements>:last-child': {
                     color: isDestructive && 'var(--button-color)',
@@ -281,7 +281,7 @@ export const MenuItemStyled = styled(MuiMenuItem, {
                     flexDirection: 'row',
                     flexWrap: 'nowrap',
                     justifyContent: 'flex-end',
-                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.56)' : 'var(--error-text)',
+                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.75)' : 'var(--error-text)',
                     gap: '4px',
                     marginInlineStart: '24px',
                     fontSize: '12px',
@@ -289,7 +289,7 @@ export const MenuItemStyled = styled(MuiMenuItem, {
                     alignItems: 'center',
                 },
                 '&:hover .trailing-elements': {
-                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.72)' : 'var(--button-color)',
+                    color: isRegular ? 'rgba(var(--center-channel-color-rgb), 0.75)' : 'var(--button-color)',
                 },
             },
         });
diff --git a/webapp/channels/src/components/new_channel_modal/new_channel_modal.scss b/webapp/channels/src/components/new_channel_modal/new_channel_modal.scss
index 2f276fe004..a11a2c6037 100644
--- a/webapp/channels/src/components/new_channel_modal/new_channel_modal.scss
+++ b/webapp/channels/src/components/new_channel_modal/new_channel_modal.scss
@@ -38,7 +38,7 @@
 
         .new-channel-modal-purpose-info {
             margin-top: 5px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             line-height: 16px;
             text-align: left;
diff --git a/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist.tsx b/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist.tsx
index 81fd7b70f4..ca3e48ea78 100644
--- a/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist.tsx
+++ b/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist.tsx
@@ -69,7 +69,7 @@ const TaskItems = styled.div`
 
     p {
         font-size: 12px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         padding: 4px 24px;
     }
 
@@ -101,12 +101,12 @@ const Button = styled.button<{open: boolean}>(({open}) => {
         background: var(--center-channel-bg);
         border: solid 1px rgba(var(--center-channel-color-rgb), 0.16);
         box-shadow: var(--elevation-3);
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
 
         &:hover {
             border-color: rgba(var(--center-channel-color-rgb), 0.24);
             box-shadow: var(--elevation-4);
-            color: rgba(var(--center-channel-color-rgb), 0.72)
+            color: rgba(var(--center-channel-color-rgb), 0.75)
         }
 
         span {
diff --git a/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist_completed.tsx b/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist_completed.tsx
index 5806aaa91b..bfd9910cea 100644
--- a/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist_completed.tsx
+++ b/webapp/channels/src/components/onboarding_tasklist/onboarding_tasklist_completed.tsx
@@ -71,7 +71,7 @@ const CompletedWrapper = styled.div`
 
     .start-trial-text, .completed-subtitle {
         font-size: 14px !important;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         line-height: 20px;
     }
 
@@ -82,7 +82,7 @@ const CompletedWrapper = styled.div`
     .disclaimer, .download-apps {
         width: 90%;
         margin-top: 15px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-family: "Open Sans";
         font-style: normal;
         font-weight: normal;
diff --git a/webapp/channels/src/components/payment_form/card_input.css b/webapp/channels/src/components/payment_form/card_input.css
index aa4b9d112f..99b5223ec0 100644
--- a/webapp/channels/src/components/payment_form/card_input.css
+++ b/webapp/channels/src/components/payment_form/card_input.css
@@ -21,7 +21,7 @@
 }
 
 .StripeElement::placeholder {
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 14px;
     opacity: 0.5;
 }
diff --git a/webapp/channels/src/components/payment_form/card_input.tsx b/webapp/channels/src/components/payment_form/card_input.tsx
index d7ec372278..706c2e5d24 100644
--- a/webapp/channels/src/components/payment_form/card_input.tsx
+++ b/webapp/channels/src/components/payment_form/card_input.tsx
@@ -144,7 +144,7 @@ class CardInput extends React.PureComponent<Props, State> {
                     fontSmoothing: 'antialiased',
                     color: theme.centerChannelColor,
                     '::placeholder': {
-                        color: `rgba(${toRgbValues(theme.centerChannelColor)}, 0.64)`,
+                        color: `rgba(${toRgbValues(theme.centerChannelColor)}, 0.75)`,
                     },
                 },
                 invalid: {
diff --git a/webapp/channels/src/components/payment_form/gather_intent/gather_intent.scss b/webapp/channels/src/components/payment_form/gather_intent/gather_intent.scss
index 8b078a6b9e..a27977dbd2 100644
--- a/webapp/channels/src/components/payment_form/gather_intent/gather_intent.scss
+++ b/webapp/channels/src/components/payment_form/gather_intent/gather_intent.scss
@@ -6,7 +6,7 @@
     &__title {
         padding: 0;
         margin: 0 0 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 16px !important;
         font-weight: 600 !important;
         line-height: 24px !important;
@@ -26,7 +26,7 @@
 
 .savedFeedback__text {
     align-self: center;
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 22px;
     font-weight: 600;
 }
@@ -75,7 +75,7 @@
 
         h3 {
             margin: 0;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 22px;
             font-weight: bold;
             line-height: 28px;
@@ -86,7 +86,7 @@
             border: none;
             margin-left: auto;
             background: var(--center-channel-bg);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
             font-size: 24px;
         }
     }
@@ -96,7 +96,7 @@
         overflow: auto;
         padding: 0 32px;
         margin-bottom: 24px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
     }
 
     &__submitted-icon-container {
@@ -115,7 +115,7 @@
 
         &__question {
             margin-bottom: 10px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 14px;
             font-weight: 600;
         }
@@ -123,7 +123,7 @@
         &__option {
             margin-top: 0;
             margin-bottom: 12px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 14px;
             font-weight: 400;
         }
diff --git a/webapp/channels/src/components/payment_form/payment_form.scss b/webapp/channels/src/components/payment_form/payment_form.scss
index 97d85d26c3..c8d933c79b 100644
--- a/webapp/channels/src/components/payment_form/payment_form.scss
+++ b/webapp/channels/src/components/payment_form/payment_form.scss
@@ -30,7 +30,7 @@
 
     .section-title {
         margin-bottom: 24px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 16px;
         font-weight: 600;
         text-align: left;
@@ -108,7 +108,7 @@
 
             &::placeholder {
                 color: var(--center-channel-color);
-                opacity: 0.64;
+                opacity: 0.73;
             }
         }
     }
diff --git a/webapp/channels/src/components/plugin_marketplace/marketplace_modal.scss b/webapp/channels/src/components/plugin_marketplace/marketplace_modal.scss
index 6f6b33b6af..73baeba36d 100644
--- a/webapp/channels/src/components/plugin_marketplace/marketplace_modal.scss
+++ b/webapp/channels/src/components/plugin_marketplace/marketplace_modal.scss
@@ -58,7 +58,7 @@
                 padding: 13px 12px;
                 border: none;
                 background: transparent;
-                color: rgba(var(--center-channel-color-rgb), 0.64);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 14px;
                 font-weight: 600;
                 line-height: 20px;
diff --git a/webapp/channels/src/components/post_edit_history/post_edit_history.scss b/webapp/channels/src/components/post_edit_history/post_edit_history.scss
index d0c53c4bc2..a86ac33430 100644
--- a/webapp/channels/src/components/post_edit_history/post_edit_history.scss
+++ b/webapp/channels/src/components/post_edit_history/post_edit_history.scss
@@ -28,7 +28,7 @@
     }
 
     &__error_subheading {
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-weight: 400;
     }
 }
diff --git a/webapp/channels/src/components/post_priority/post_priority_picker.tsx b/webapp/channels/src/components/post_priority/post_priority_picker.tsx
index 0ced06c22c..23d3963ad2 100644
--- a/webapp/channels/src/components/post_priority/post_priority_picker.tsx
+++ b/webapp/channels/src/components/post_priority/post_priority_picker.tsx
@@ -33,15 +33,15 @@ const ImportantIcon = styled(AlertCircleOutlineIcon)`
 `;
 
 const StandardIcon = styled(MessageTextOutlineIcon)`
-    fill: rgba(var(--center-channel-color-rgb), 0.56);
+    fill: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 const AcknowledgementIcon = styled(CheckCircleOutlineIcon)`
-    fill: rgba(var(--center-channel-color-rgb), 0.56);
+    fill: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 const PersistentNotificationsIcon = styled(BellRingOutlineIcon)`
-    fill: rgba(var(--center-channel-color-rgb), 0.56);
+    fill: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 const Header = styled.h4`
diff --git a/webapp/channels/src/components/post_priority/post_priority_picker_item.tsx b/webapp/channels/src/components/post_priority/post_priority_picker_item.tsx
index d5ea91b56a..8ff8ea6d47 100644
--- a/webapp/channels/src/components/post_priority/post_priority_picker_item.tsx
+++ b/webapp/channels/src/components/post_priority/post_priority_picker_item.tsx
@@ -53,7 +53,7 @@ const Text = styled.div`
 const Description = styled.div`
     padding: 0 44px 6px;
     font-size: 12px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 const ToggleWrapper = styled.div`
diff --git a/webapp/channels/src/components/post_reminder_custom_time_picker_modal/post_reminder_custom_time_picker_modal.scss b/webapp/channels/src/components/post_reminder_custom_time_picker_modal/post_reminder_custom_time_picker_modal.scss
index a4f84dde72..55c36d5ee3 100644
--- a/webapp/channels/src/components/post_reminder_custom_time_picker_modal/post_reminder_custom_time_picker_modal.scss
+++ b/webapp/channels/src/components/post_reminder_custom_time_picker_modal/post_reminder_custom_time_picker_modal.scss
@@ -25,7 +25,7 @@
 
         button.dateTime__calendar-icon {
             margin: 0 8px 0 0;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
         }
 
         input#customStatus__calendar-input {
diff --git a/webapp/channels/src/components/post_view/acknowledgements/post_acknowledgements_users_popover.tsx b/webapp/channels/src/components/post_view/acknowledgements/post_acknowledgements_users_popover.tsx
index 4f7fce9454..2184e40482 100644
--- a/webapp/channels/src/components/post_view/acknowledgements/post_acknowledgements_users_popover.tsx
+++ b/webapp/channels/src/components/post_view/acknowledgements/post_acknowledgements_users_popover.tsx
@@ -39,7 +39,7 @@ const Info = styled.div`
 `;
 
 const Title = styled.div`
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 12px;
     font-weight: 600;
     line-height: 16px;
@@ -47,7 +47,7 @@ const Title = styled.div`
 `;
 
 const Span = styled.span`
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 12px;
     line-height: 18px;
 `;
diff --git a/webapp/channels/src/components/post_view/post_attachment_opengraph/post_attachment_opengraph.scss b/webapp/channels/src/components/post_view/post_attachment_opengraph/post_attachment_opengraph.scss
index d2cb20866d..4c60b28609 100644
--- a/webapp/channels/src/components/post_view/post_attachment_opengraph/post_attachment_opengraph.scss
+++ b/webapp/channels/src/components/post_view/post_attachment_opengraph/post_attachment_opengraph.scss
@@ -57,11 +57,11 @@
         padding: 5px;
         background-color: rgba(var(--center-channel-color-rgb), 0);
         border-radius: 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
 
         &:hover:not(:active) {
             background-color: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.8);
         }
 
         &:active {
@@ -80,7 +80,7 @@
         }
 
         .sitename {
-            color: rgba(var(--center-channel-color-rgb), 0.64);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 11px;
             font-weight: 400;
             line-height: 16px;
@@ -161,7 +161,7 @@
             border: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
             background-color: var(--center-channel-bg);
             border-radius: 50%;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             place-content: center;
             place-items: center;
diff --git a/webapp/channels/src/components/post_view/reaction/reaction.scss b/webapp/channels/src/components/post_view/reaction/reaction.scss
index 07ec843413..476d51e8ad 100644
--- a/webapp/channels/src/components/post_view/reaction/reaction.scss
+++ b/webapp/channels/src/components/post_view/reaction/reaction.scss
@@ -21,9 +21,9 @@
     margin: 0 4px 4px 0;
     background: rgba(var(--center-channel-color-rgb), 0.08);
     border-radius: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     cursor: pointer;
-    fill: rgba(var(--center-channel-color-rgb), 0.56);
+    fill: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 11px;
     font-weight: 600;
     transition:
@@ -34,15 +34,15 @@
     &:hover {
         border: solid 1px rgba(#3d3c40, 0.16);
         background-color: transparent;
-        color: rgba(#3d3c40, 0.72);
+        color: rgba(#3d3c40, 0.75);
     }
 
     &:not(.Reaction--reacted) {
         &:hover {
             border-color: rgba(var(--center-channel-color-rgb), 0.16);
             background-color: v(center-channel-bg);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
-            fill: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         &:active {
diff --git a/webapp/channels/src/components/preparing_workspace/description.scss b/webapp/channels/src/components/preparing_workspace/description.scss
index 5d4b8ef630..ca0e321938 100644
--- a/webapp/channels/src/components/preparing_workspace/description.scss
+++ b/webapp/channels/src/components/preparing_workspace/description.scss
@@ -1,6 +1,6 @@
 .PreparingWorkspaceDescription {
     margin-bottom: 24px;
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 18px;
 }
 
diff --git a/webapp/channels/src/components/preparing_workspace/invite_members_link.scss b/webapp/channels/src/components/preparing_workspace/invite_members_link.scss
index 8171056b42..a3f09a09ff 100644
--- a/webapp/channels/src/components/preparing_workspace/invite_members_link.scss
+++ b/webapp/channels/src/components/preparing_workspace/invite_members_link.scss
@@ -13,7 +13,7 @@
         border-left: 1px solid rgba(var(--center-channel-color-rgb), 0.2);
         background: var(--center-channel-color-rgb);
         border-radius: 4px 0 0 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 16px;
     }
 
diff --git a/webapp/channels/src/components/preparing_workspace/organization.scss b/webapp/channels/src/components/preparing_workspace/organization.scss
index c063010404..8363d7920e 100644
--- a/webapp/channels/src/components/preparing_workspace/organization.scss
+++ b/webapp/channels/src/components/preparing_workspace/organization.scss
@@ -29,7 +29,7 @@
     &__status {
         display: flex;
         align-items: center;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
 
         &--error {
diff --git a/webapp/channels/src/components/pricing_modal/pricing_modal.scss b/webapp/channels/src/components/pricing_modal/pricing_modal.scss
index 40247dc2f4..b1da4feda0 100644
--- a/webapp/channels/src/components/pricing_modal/pricing_modal.scss
+++ b/webapp/channels/src/components/pricing_modal/pricing_modal.scss
@@ -40,7 +40,7 @@
                 padding-left: 8px;
                 border-left: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
                 margin-left: 8px;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-family: 'Open Sans';
                 font-size: 12px;
                 font-style: normal;
@@ -135,7 +135,7 @@
 
                 .content {
                     margin-bottom: 25px;
-                    color: rgba(var(--center-channel-color-rgb), 0.72);
+                    color: rgba(var(--center-channel-color-rgb), 0.75);
                     font-family: 'Open Sans';
                     font-size: 14px;
                     font-style: normal;
@@ -242,7 +242,7 @@
                         span,
                         p {
                             margin-bottom: 32px;
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.75);
                             font-family: 'Metropolis';
                             font-size: 16px;
                             font-style: normal;
@@ -370,7 +370,7 @@
 
                                 p {
                                     margin: 0;
-                                    color: rgba(var(--center-channel-color-rgb), 0.72);
+                                    color: rgba(var(--center-channel-color-rgb), 0.75);
                                     font-family: 'Metropolis';
                                     font-size: 14px;
                                     font-style: normal;
@@ -391,7 +391,7 @@
                     position: relative;
                     height: auto;
                     padding: 37px 24px 24px 24px;
-                    background-color: rgba(var(--center-channel-text-rgb), 0.56);
+                    background-color: rgba(var(--center-channel-text-rgb), 0.75);
                     border-radius: 0 0 4px 4px;
                     color: var(--sidebar-text);
 
diff --git a/webapp/channels/src/components/pricing_modal/start_trial_caution.tsx b/webapp/channels/src/components/pricing_modal/start_trial_caution.tsx
index 72906bdc0d..4ee95a6bed 100644
--- a/webapp/channels/src/components/pricing_modal/start_trial_caution.tsx
+++ b/webapp/channels/src/components/pricing_modal/start_trial_caution.tsx
@@ -16,7 +16,7 @@ font-weight: 400;
 font-size: 10px;
 line-height: 14px;
 letter-spacing: 0.02em;
-color: rgba(var(--center-channel-color-rgb), 0.56);
+color: rgba(var(--center-channel-color-rgb), 0.75);
 `;
 
 const Span = styled.span`
diff --git a/webapp/channels/src/components/profile_popover/profile_popover.scss b/webapp/channels/src/components/profile_popover/profile_popover.scss
index 2b07d71be5..68574dccf7 100644
--- a/webapp/channels/src/components/profile_popover/profile_popover.scss
+++ b/webapp/channels/src/components/profile_popover/profile_popover.scss
@@ -25,7 +25,7 @@
 .user-popover-last-active {
     display: block;
     margin: 8px 0 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 11px;
     font-weight: 400;
     letter-spacing: 0.02em;
@@ -112,11 +112,12 @@
                 width: 32px;
                 padding: 0;
                 background-color: unset;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
 
                 &:hover {
                     background: rgba(var(--center-channel-color-rgb), 0.08);
                     border-radius: 4px;
+                    color: rgba(var(--center-channel-color-rgb), 0.8);
                 }
             }
 
diff --git a/webapp/channels/src/components/purchase_modal/purchase.scss b/webapp/channels/src/components/purchase_modal/purchase.scss
index 79db8606b9..54327a8c52 100644
--- a/webapp/channels/src/components/purchase_modal/purchase.scss
+++ b/webapp/channels/src/components/purchase_modal/purchase.scss
@@ -28,7 +28,7 @@
 
         .footer-text {
             .normal-payment-text {
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 14px;
             }
 
@@ -48,7 +48,7 @@
 
         .fineprint-text {
             margin-top: 24px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             line-height: 16px;
         }
@@ -321,7 +321,7 @@
                         }
 
                         p {
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.75);
                             font-family: 'Metropolis';
                             font-size: 18px;
                             font-style: normal;
@@ -338,7 +338,7 @@
                         text-align: center;
 
                         h4 {
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.75);
                             font-family: 'Metropolis';
                             font-size: 20px;
                             font-style: normal;
@@ -365,7 +365,7 @@
                         }
 
                         p {
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.75);
                             font-family: 'Metropolis';
                             font-size: 18px;
                             font-style: normal;
@@ -394,7 +394,7 @@
 
                         margin-top: 16px;
                         margin-bottom: 24px;
-                        color: rgba(var(--center-channel-color-rgb), 0.72);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         font-size: 12px;
                         font-style: normal;
                         font-weight: 400;
@@ -465,7 +465,7 @@
 
                             .icon-information-outline {
                                 margin: 0;
-                                color: rgba(var(--sys-denim-center-channel-text-rgb), 0.72);
+                                color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
                             }
                         }
 
@@ -490,7 +490,7 @@
                     display: flex;
                     flex-direction: column;
                     margin-top: 24px;
-                    color: rgba(var(--center-channel-color-rgb), 0.72);
+                    color: rgba(var(--center-channel-color-rgb), 0.75);
                     font-size: 12px;
                     font-style: normal;
                     font-weight: 400;
diff --git a/webapp/channels/src/components/search_results/files_filter_menu.scss b/webapp/channels/src/components/search_results/files_filter_menu.scss
index 03d199a943..164310a585 100644
--- a/webapp/channels/src/components/search_results/files_filter_menu.scss
+++ b/webapp/channels/src/components/search_results/files_filter_menu.scss
@@ -14,7 +14,7 @@
             border: none;
             background: transparent;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             cursor: pointer;
             text-align: center;
 
@@ -31,7 +31,7 @@
 
             &:hover {
                 background: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
             }
         }
     }
diff --git a/webapp/channels/src/components/search_results/messages_or_files_selector.scss b/webapp/channels/src/components/search_results/messages_or_files_selector.scss
index 2ae62f6401..35d63543f0 100644
--- a/webapp/channels/src/components/search_results/messages_or_files_selector.scss
+++ b/webapp/channels/src/components/search_results/messages_or_files_selector.scss
@@ -15,7 +15,7 @@
         margin-right: 4px;
         background-color: rgba(var(--center-channel-bg-rgb), 1);
         border-radius: 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         cursor: pointer;
         font-weight: 600;
         text-decoration: none;
diff --git a/webapp/channels/src/components/search_results/search_limits_banner.tsx b/webapp/channels/src/components/search_results/search_limits_banner.tsx
index 03fb92b1f6..5a980b5718 100644
--- a/webapp/channels/src/components/search_results/search_limits_banner.tsx
+++ b/webapp/channels/src/components/search_results/search_limits_banner.tsx
@@ -33,7 +33,7 @@ border-radius: 4px;
 background-color: rgba(var(--center-channel-color-rgb), 0.04);
 padding: 10px;
 margin: 10px;
-color: rgba(var(--center-channel-color-rgb), 0.72);
+color: rgba(var(--center-channel-color-rgb), 0.75);
 font-weight: 400;
 font-size: 11px;
 line-height: 16px;
diff --git a/webapp/channels/src/components/seats_calculator/index.tsx b/webapp/channels/src/components/seats_calculator/index.tsx
index bc2cdb468d..f35c581853 100644
--- a/webapp/channels/src/components/seats_calculator/index.tsx
+++ b/webapp/channels/src/components/seats_calculator/index.tsx
@@ -205,7 +205,7 @@ export default function SeatsCalculator(props: Props) {
                             >
                                 <InformationOutlineIcon
                                     size={18}
-                                    color={'rgba(var(--center-channel-text-rgb), 0.72)'}
+                                    color={'rgba(var(--center-channel-text-rgb), 0.75)'}
                                 />
                             </OverlayTrigger>
                         </div>
diff --git a/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/expansion_card.scss b/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/expansion_card.scss
index e6910940f0..d4ebc0ced4 100644
--- a/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/expansion_card.scss
+++ b/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/expansion_card.scss
@@ -13,7 +13,7 @@
     &__RHSCardTitle {
         display: block;
         margin-bottom: 12px;
-        color: rgba(var(--sys-denim-center-channel-text-rgb), 0.72);
+        color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
         font-size: 14px;
         font-weight: 600;
         text-align: center;
@@ -43,14 +43,14 @@
         text-align: center;
 
         .planName {
-            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.72);
+            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
             font-size: 20px;
             font-weight: 400;
             text-transform: capitalize;
         }
 
         .usage {
-            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.56);
+            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
             font-size: 12px;
             font-weight: 600;
 
@@ -78,7 +78,7 @@
         }
 
         .costPerUser > span:last-child {
-            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.72);
+            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
             font-size: 12px;
         }
 
@@ -93,7 +93,7 @@
         }
 
         .totalCostWarning > span:last-child {
-            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.72);
+            color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
             font-size: 12px;
         }
 
@@ -124,7 +124,7 @@
     }
 
     &__ChargedTodayDisclaimer {
-        color: rgba(var(--sys-denim-center-channel-text-rgb), 0.72);
+        color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
         font-size: 12px;
         font-weight: 400;
     }
diff --git a/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/self_hosted_expansion_modal.scss b/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/self_hosted_expansion_modal.scss
index 1938890b37..3cd20f0915 100644
--- a/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/self_hosted_expansion_modal.scss
+++ b/webapp/channels/src/components/self_hosted_purchases/self_hosted_expansion_modal/self_hosted_expansion_modal.scss
@@ -60,7 +60,7 @@
             .section-title {
                 display: block;
                 margin-bottom: 10px;
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 16px;
                 font-weight: 600;
                 text-align: left;
diff --git a/webapp/channels/src/components/self_hosted_purchases/self_hosted_purchase_modal/self_hosted_purchase_modal.scss b/webapp/channels/src/components/self_hosted_purchases/self_hosted_purchase_modal/self_hosted_purchase_modal.scss
index 52bac49aec..58d5ac31c8 100644
--- a/webapp/channels/src/components/self_hosted_purchases/self_hosted_purchase_modal/self_hosted_purchase_modal.scss
+++ b/webapp/channels/src/components/self_hosted_purchases/self_hosted_purchase_modal/self_hosted_purchase_modal.scss
@@ -61,7 +61,7 @@
 
             .section-title {
                 margin-bottom: 24px;
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 16px;
                 font-weight: 600;
                 text-align: left;
@@ -288,7 +288,7 @@
                         }
 
                         p {
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.75);
                             font-family: 'Metropolis';
                             font-size: 18px;
                             font-style: normal;
@@ -305,7 +305,7 @@
                         text-align: center;
 
                         h4 {
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.75);
                             font-family: 'Metropolis';
                             font-size: 20px;
                             font-style: normal;
@@ -332,7 +332,7 @@
                         }
 
                         p {
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.75);
                             font-family: 'Metropolis';
                             font-size: 18px;
                             font-style: normal;
@@ -361,7 +361,7 @@
 
                         margin-top: 16px;
                         margin-bottom: 24px;
-                        color: rgba(var(--center-channel-color-rgb), 0.72);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         font-size: 12px;
                         font-style: normal;
                         font-weight: 400;
@@ -432,7 +432,7 @@
 
                             .icon-information-outline {
                                 margin: 0;
-                                color: rgba(var(--sys-denim-center-channel-text-rgb), 0.72);
+                                color: rgba(var(--sys-denim-center-channel-text-rgb), 0.75);
                             }
                         }
 
@@ -460,7 +460,7 @@
         display: flex;
         flex-direction: column;
         margin-top: 24px;
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-style: normal;
         font-weight: 400;
diff --git a/webapp/channels/src/components/shortcut_key/shortcut_key.scss b/webapp/channels/src/components/shortcut_key/shortcut_key.scss
index ae327291b4..f3aa2bd6ad 100644
--- a/webapp/channels/src/components/shortcut_key/shortcut_key.scss
+++ b/webapp/channels/src/components/shortcut_key/shortcut_key.scss
@@ -17,7 +17,7 @@
         &.shortcut-key--tooltip {
             padding: 2px 5px;
             background-color: rgba(255, 255, 255, 0.08);
-            color: rgba(255, 255, 255, 0.72);
+            color: rgba(255, 255, 255, 0.75);
             font-family: inherit;
             font-size: 12px;
             font-weight: 600;
@@ -27,7 +27,7 @@
         &.shortcut-key--tutorial-tip {
             padding: 2px 5px;
             background-color: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-family: inherit;
             font-size: 12px;
             font-weight: 600;
diff --git a/webapp/channels/src/components/signup/signup.scss b/webapp/channels/src/components/signup/signup.scss
index 072e2f4505..a4b5e9c91f 100644
--- a/webapp/channels/src/components/signup/signup.scss
+++ b/webapp/channels/src/components/signup/signup.scss
@@ -46,7 +46,7 @@
             }
 
             .signup-body-no-login-subtitle {
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 18px;
                 font-weight: 400;
                 line-height: 28px;
@@ -56,7 +56,7 @@
 
         .signup-body-message-subtitle {
             padding-right: 170px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 18px;
             font-weight: 400;
             line-height: 28px;
@@ -169,7 +169,7 @@
                     .newsletter {
                         margin-top: 24px;
                         margin-bottom: 32px;
-                        color: rgba(var(--center-channel-color-rgb), 0.56);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         font-family: 'Open Sans';
                         font-size: 12px;
                         font-style: normal;
@@ -202,7 +202,7 @@
                     .signup-body-card-form-divider-label {
                         padding: 0 10px;
                         background-color: var(--center-channel-bg);
-                        color: rgba(var(--center-channel-color-rgb), 0.56);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         font-size: 12px;
                         line-height: 0;
                     }
@@ -225,7 +225,7 @@
 
                 .signup-body-card-agreement {
                     margin-top: 32px;
-                    color: rgba(var(--center-channel-color-rgb), 0.56);
+                    color: rgba(var(--center-channel-color-rgb), 0.75);
                     font-size: 11px;
                     line-height: 16px;
 
@@ -258,7 +258,7 @@
             p {
                 width: 100%;
                 margin: 0;
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 18px;
                 font-weight: 400;
                 line-height: 28px;
diff --git a/webapp/channels/src/components/start_trial_form_modal/air_gapped_modal.scss b/webapp/channels/src/components/start_trial_form_modal/air_gapped_modal.scss
index 1dada4f69e..275546daa1 100644
--- a/webapp/channels/src/components/start_trial_form_modal/air_gapped_modal.scss
+++ b/webapp/channels/src/components/start_trial_form_modal/air_gapped_modal.scss
@@ -22,7 +22,7 @@
             &:focus,
             &:active:focus {
                 background-color: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.8);
                 opacity: 1;
             }
 
@@ -31,7 +31,7 @@
             width: 24px;
             height: 24px;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56) !important;
+            color: rgba(var(--center-channel-color-rgb), 0.75) !important;
             font-family: 'Open Sans', sans-serif;
             font-size: 32px;
             font-weight: 400;
diff --git a/webapp/channels/src/components/start_trial_form_modal/start_trial_form_modal.scss b/webapp/channels/src/components/start_trial_form_modal/start_trial_form_modal.scss
index 075b6aaf1a..38d0bce6ac 100644
--- a/webapp/channels/src/components/start_trial_form_modal/start_trial_form_modal.scss
+++ b/webapp/channels/src/components/start_trial_form_modal/start_trial_form_modal.scss
@@ -26,7 +26,7 @@
             &:focus,
             &:active:focus {
                 background-color: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 opacity: 1;
             }
 
@@ -35,7 +35,7 @@
             width: 24px;
             height: 24px;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56) !important;
+            color: rgba(var(--center-channel-color-rgb), 0.75) !important;
             font-family:
                 'Open Sans',
                 sans-serif;
@@ -55,7 +55,7 @@
         .description {
             margin: 0 auto;
             margin-top: 8px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-family: 'Open Sans';
             font-size: 14px;
             font-style: normal;
@@ -91,7 +91,7 @@
             margin: 0;
             margin-top: 36px;
             margin-bottom: 32px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-family: 'Open Sans';
             font-size: 12px;
             font-style: normal;
diff --git a/webapp/channels/src/components/status_dropdown/status_dropdown.scss b/webapp/channels/src/components/status_dropdown/status_dropdown.scss
index 0cf9a3d203..0facf11388 100644
--- a/webapp/channels/src/components/status_dropdown/status_dropdown.scss
+++ b/webapp/channels/src/components/status_dropdown/status_dropdown.scss
@@ -1,12 +1,12 @@
 .profile__icon {
     &:hover {
-        fill: rgba(255, 0, 0, 0.72);
+        fill: rgba(255, 0, 0, 0.75);
     }
 }
 
 .logout__icon {
     &:hover {
-        fill: rgba(255, 0, 0, 0.72);
+        fill: rgba(255, 0, 0, 0.75);
     }
 }
 
@@ -87,7 +87,7 @@ button.custom_status__row {
         background-color: rgba(var(--center-channel-color-rgb), 0.08);
 
         .custom-status-emoji {
-            fill: rgba(var(--center-channel-color-rgb), 0.72);
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
         }
     }
 
@@ -144,10 +144,10 @@ button.custom_status__row {
 
 .custom-status {
     &-emoji {
-        fill: rgba(var(--center-channel-color-rgb), 0.56);
+        fill: rgba(var(--center-channel-color-rgb), 0.75);
 
         &:hover {
-            fill: rgba(var(--center-channel-color-rgb), 0.72);
+            fill: rgba(var(--center-channel-color-rgb), 0.88);
         }
     }
 
@@ -161,7 +161,7 @@ button.custom_status__row {
     border-radius: 4px;
 
     .icon > i:not(.status-icon) {
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
         font-family: "compass-icons";
     }
 
@@ -347,7 +347,7 @@ button.custom_status__row {
 
 .status-dropdpwn-menu .status-dropdown-menu__clear-container .input-clear {
     position: absolute;
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     opacity: 1;
 }
 
diff --git a/webapp/channels/src/components/switch_to_yearly_plan_confirm_modal/switch_to_yearly_plan_confirm_modal.scss b/webapp/channels/src/components/switch_to_yearly_plan_confirm_modal/switch_to_yearly_plan_confirm_modal.scss
index 7dab0d1c89..a9d511c9db 100644
--- a/webapp/channels/src/components/switch_to_yearly_plan_confirm_modal/switch_to_yearly_plan_confirm_modal.scss
+++ b/webapp/channels/src/components/switch_to_yearly_plan_confirm_modal/switch_to_yearly_plan_confirm_modal.scss
@@ -5,7 +5,7 @@
 
         button.close {
             span {
-                color: rgba(63, 67, 80, 0.56) !important;
+                color: rgba(63, 67, 80, 0.75) !important;
             }
         }
     }
diff --git a/webapp/channels/src/components/threading/channel_threads/thread_footer/thread_footer.scss b/webapp/channels/src/components/threading/channel_threads/thread_footer/thread_footer.scss
index 60ed5f9363..588ed68612 100644
--- a/webapp/channels/src/components/threading/channel_threads/thread_footer/thread_footer.scss
+++ b/webapp/channels/src/components/threading/channel_threads/thread_footer/thread_footer.scss
@@ -10,7 +10,7 @@
     padding: 0 0 5px 10px;
     margin-top: 1px;
     margin-bottom: 5px;
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 12px;
     line-height: 15px;
     white-space: nowrap;
diff --git a/webapp/channels/src/components/threading/common/button/button.scss b/webapp/channels/src/components/threading/common/button/button.scss
index dac411de32..8a9f875387 100644
--- a/webapp/channels/src/components/threading/common/button/button.scss
+++ b/webapp/channels/src/components/threading/common/button/button.scss
@@ -32,7 +32,7 @@
 @mixin leveled-color($hover, $active) {
     &:hover {
         &:not(:disabled) {
-            color: rgba($hover, 0.72);
+            color: rgba($hover, 0.75);
         }
     }
 
@@ -48,7 +48,7 @@
     position: relative;
     padding: 4px 10px;
     border-radius: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-family: Open Sans;
     font-style: normal;
     font-weight: 600;
diff --git a/webapp/channels/src/components/threading/global_threads/thread_item/attachments/file_card/file_card.scss b/webapp/channels/src/components/threading/global_threads/thread_item/attachments/file_card/file_card.scss
index a26061ff66..6acb05b8d4 100644
--- a/webapp/channels/src/components/threading/global_threads/thread_item/attachments/file_card/file_card.scss
+++ b/webapp/channels/src/components/threading/global_threads/thread_item/attachments/file_card/file_card.scss
@@ -22,7 +22,7 @@
     &__size {
         flex-shrink: 0;
         margin-left: auto;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
     }
 
diff --git a/webapp/channels/src/components/threading/global_threads/thread_item/thread_item.scss b/webapp/channels/src/components/threading/global_threads/thread_item/thread_item.scss
index 5734a847bc..d62e42393a 100644
--- a/webapp/channels/src/components/threading/global_threads/thread_item/thread_item.scss
+++ b/webapp/channels/src/components/threading/global_threads/thread_item/thread_item.scss
@@ -59,7 +59,7 @@
     .activity {
         display: flex;
         align-items: center;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-weight: 600;
         line-height: 15px;
@@ -130,7 +130,7 @@
     }
 
     time {
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-weight: normal;
         grid-column: 3/4;
diff --git a/webapp/channels/src/components/threading/global_threads/thread_list/thread_list.scss b/webapp/channels/src/components/threading/global_threads/thread_list/thread_list.scss
index f94b8430a4..98e5515ead 100644
--- a/webapp/channels/src/components/threading/global_threads/thread_list/thread_list.scss
+++ b/webapp/channels/src/components/threading/global_threads/thread_list/thread_list.scss
@@ -10,7 +10,7 @@
         padding-right: 12px;
         padding-left: 14px;
         border-bottom: var(--border);
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         grid-area: header;
 
         .tab-button-wrapper {
diff --git a/webapp/channels/src/components/threading/global_threads/thread_pane/thread_pane.scss b/webapp/channels/src/components/threading/global_threads/thread_pane/thread_pane.scss
index a6ab37ca6b..ea50d64c03 100644
--- a/webapp/channels/src/components/threading/global_threads/thread_pane/thread_pane.scss
+++ b/webapp/channels/src/components/threading/global_threads/thread_pane/thread_pane.scss
@@ -52,7 +52,7 @@
             }
 
             .Button {
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-weight: 400;
             }
         }
diff --git a/webapp/channels/src/components/threading/global_threads_link/global_threads_link.scss b/webapp/channels/src/components/threading/global_threads_link/global_threads_link.scss
index 81cfe4ff0a..e5db5b39c8 100644
--- a/webapp/channels/src/components/threading/global_threads_link/global_threads_link.scss
+++ b/webapp/channels/src/components/threading/global_threads_link/global_threads_link.scss
@@ -15,7 +15,7 @@
             margin-left: 1px;
 
             svg {
-                fill: rgba(var(--sidebar-text-rgb), 0.6);
+                fill: rgba(var(--sidebar-text-rgb), 0.75);
                 vertical-align: middle;
             }
         }
@@ -42,7 +42,7 @@
         margin-top: 1px;
 
         svg {
-            fill: rgba(var(--sidebar-text-rgb), 0.6);
+            fill: rgba(var(--sidebar-text-rgb), 0.75);
         }
     }
 
diff --git a/webapp/channels/src/components/threading/virtualized_thread_viewer/create_comment.tsx b/webapp/channels/src/components/threading/virtualized_thread_viewer/create_comment.tsx
index 020177598b..bcd9e046bd 100644
--- a/webapp/channels/src/components/threading/virtualized_thread_viewer/create_comment.tsx
+++ b/webapp/channels/src/components/threading/virtualized_thread_viewer/create_comment.tsx
@@ -79,7 +79,7 @@ const CreateComment = forwardRef<HTMLDivElement, Props>(({
                 <div className='channel-archived-warning__content'>
                     <ArchiveOutlineIcon
                         size={20}
-                        color={'rgba(var(--center-channel-color-rgb), 0.56)'}
+                        color={'rgba(var(--center-channel-color-rgb), 0.75)'}
                     />
                     <FormattedMarkdownMessage
                         id='threadFromArchivedChannelMessage'
diff --git a/webapp/channels/src/components/three_days_left_trial_modal/three_days_left_trial_modal.scss b/webapp/channels/src/components/three_days_left_trial_modal/three_days_left_trial_modal.scss
index 93dd82662a..db48a42b5d 100644
--- a/webapp/channels/src/components/three_days_left_trial_modal/three_days_left_trial_modal.scss
+++ b/webapp/channels/src/components/three_days_left_trial_modal/three_days_left_trial_modal.scss
@@ -20,7 +20,7 @@
         padding-bottom: 24px !important;
 
         .header-subtitle-text {
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             font-weight: 400;
             line-height: 16px;
@@ -75,7 +75,7 @@
                 margin: 24px 0;
 
                 .limits-title {
-                    color: rgba(var(--center-channel-color-rgb), 0.56);
+                    color: rgba(var(--center-channel-color-rgb), 0.75);
                     font-size: 10px;
                     font-weight: 700;
                     letter-spacing: 0.02em;
diff --git a/webapp/channels/src/components/toast/toast.scss b/webapp/channels/src/components/toast/toast.scss
index 80514f46b8..e6b888498e 100644
--- a/webapp/channels/src/components/toast/toast.scss
+++ b/webapp/channels/src/components/toast/toast.scss
@@ -102,5 +102,5 @@
 }
 
 .tooltip__shortcut--txt {
-    opacity: 0.6;
+    opacity: 0.73;
 }
diff --git a/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal.scss b/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal.scss
index b007fca3a6..ff5be72723 100644
--- a/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal.scss
+++ b/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal.scss
@@ -19,7 +19,7 @@
             &:focus,
             &:active:focus {
                 background-color: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.8);
                 opacity: 1;
             }
 
@@ -28,7 +28,7 @@
             width: 4rem;
             height: 4rem;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56) !important;
+            color: rgba(var(--center-channel-color-rgb), 0.75) !important;
             font-family:
                 'Open Sans',
                 sans-serif;
diff --git a/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal_step.scss b/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal_step.scss
index 98e8a8ea26..d14a829d03 100644
--- a/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal_step.scss
+++ b/webapp/channels/src/components/trial_benefits_modal/trial_benefits_modal_step.scss
@@ -43,7 +43,7 @@
             position: fixed;
             bottom: 24px;
             left: 24px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             font-style: normal;
             font-weight: normal;
diff --git a/webapp/channels/src/components/user_group_popover/__snapshots__/user_group_popover.test.tsx.snap b/webapp/channels/src/components/user_group_popover/__snapshots__/user_group_popover.test.tsx.snap
index 20e1823ba9..0b1782ec2a 100644
--- a/webapp/channels/src/components/user_group_popover/__snapshots__/user_group_popover.test.tsx.snap
+++ b/webapp/channels/src/components/user_group_popover/__snapshots__/user_group_popover.test.tsx.snap
@@ -208,7 +208,7 @@ exports[`component/user_group_popover should match snapshot 1`] = `
                         </Heading>
                         <Subtitle>
                           <div
-                            className="Subtitle-ocLvS yXVnq"
+                            className="Subtitle-ocLvS dzpPJy"
                           >
                             <span
                               className="overflow--ellipsis text-nowrap"
diff --git a/webapp/channels/src/components/user_group_popover/group_member_list/group_member_list.tsx b/webapp/channels/src/components/user_group_popover/group_member_list/group_member_list.tsx
index 67aa163e8c..ca3c6672b7 100644
--- a/webapp/channels/src/components/user_group_popover/group_member_list/group_member_list.tsx
+++ b/webapp/channels/src/components/user_group_popover/group_member_list/group_member_list.tsx
@@ -395,7 +395,7 @@ const LargeLoadingItem = styled.div`
 
 const LoadFailedItem = styled(LargeLoadingItem)`
     padding: 16px;
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     text-align: center;
     font-size: 12px;
 `;
diff --git a/webapp/channels/src/components/user_group_popover/user_group_popover.tsx b/webapp/channels/src/components/user_group_popover/user_group_popover.tsx
index e8235ce578..45f0cd3c56 100644
--- a/webapp/channels/src/components/user_group_popover/user_group_popover.tsx
+++ b/webapp/channels/src/components/user_group_popover/user_group_popover.tsx
@@ -316,7 +316,7 @@ const Heading = styled.div`
 
 const Subtitle = styled.div`
     font-size: 12px;
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     display: flex;
 `;
 
diff --git a/webapp/channels/src/components/user_groups_modal/user_groups_modal.scss b/webapp/channels/src/components/user_groups_modal/user_groups_modal.scss
index 203d693b97..d5f7178a97 100644
--- a/webapp/channels/src/components/user_groups_modal/user_groups_modal.scss
+++ b/webapp/channels/src/components/user_groups_modal/user_groups_modal.scss
@@ -270,13 +270,13 @@
 
                     .group-name {
                         padding-left: 8px;
-                        color: rgba(var(--center-channel-color-rgb), 0.64);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                     }
 
                     .group-member-count {
                         margin-right: 8px;
                         margin-left: auto;
-                        color: rgba(var(--center-channel-color-rgb), 0.64);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         font-size: 12px;
                         line-height: 16px;
                     }
@@ -311,7 +311,7 @@
                                     height: auto;
                                     align-self: center;
                                     padding-right: 12px;
-                                    color: rgba(var(--center-channel-color-rgb), 0.56);
+                                    color: rgba(var(--center-channel-color-rgb), 0.64);
                                     font-size: 18px;
                                     line-height: 18px;
                                 }
@@ -330,14 +330,14 @@
                         margin-left: auto;
                         background: transparent;
                         border-radius: 4px;
-                        color: rgba(var(--center-channel-color-rgb), 0.56);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         text-decoration: none;
 
                         &:hover {
                             background: rgba(var(--center-channel-color-rgb), 0.08);
                             border-radius: 4px;
-                            color: rgba(var(--center-channel-color-rgb), 0.72);
-                            fill: rgba(var(--center-channel-color-rgb), 0.72);
+                            color: rgba(var(--center-channel-color-rgb), 0.8);
+                            fill: rgba(var(--center-channel-color-rgb), 0.8);
                         }
 
                         &:active {
diff --git a/webapp/channels/src/components/view_user_group_modal/view_user_group_modal.scss b/webapp/channels/src/components/view_user_group_modal/view_user_group_modal.scss
index 22d052c8d1..c99462da98 100644
--- a/webapp/channels/src/components/view_user_group_modal/view_user_group_modal.scss
+++ b/webapp/channels/src/components/view_user_group_modal/view_user_group_modal.scss
@@ -31,7 +31,7 @@
 
             span.group-name {
                 margin-left: 70px;
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 12px;
                 line-height: 12px;
             }
@@ -91,7 +91,7 @@
 
                     .group-member-username {
                         padding-left: 8px;
-                        color: rgba(var(--center-channel-color-rgb), 0.64);
+                        color: rgba(var(--center-channel-color-rgb), 0.75);
                         font-size: 12px;
                         line-height: 18px;
                     }
diff --git a/webapp/channels/src/components/widgets/header/header.scss b/webapp/channels/src/components/widgets/header/header.scss
index b7e9440832..5b62ef4a1b 100644
--- a/webapp/channels/src/components/widgets/header/header.scss
+++ b/webapp/channels/src/components/widgets/header/header.scss
@@ -25,7 +25,7 @@
 
     > div p {
         margin: 6px 0 0;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-weight: 400;
         line-height: 16px;
diff --git a/webapp/channels/src/components/widgets/icons/admin_eye_icon.tsx b/webapp/channels/src/components/widgets/icons/admin_eye_icon.tsx
index e6bf71c961..b5bd51671e 100644
--- a/webapp/channels/src/components/widgets/icons/admin_eye_icon.tsx
+++ b/webapp/channels/src/components/widgets/icons/admin_eye_icon.tsx
@@ -21,7 +21,7 @@ export default function AdminEyeIcon(props: Props): JSX.Element {
             >
                 <path
                     d='M7 3.21005C7.3264 3.21005 7.624 3.29165 7.8928 3.45485C8.1712 3.61805 8.392 3.83885 8.5552 4.11725C8.7184 4.38605 8.8 4.68365 8.8 5.01005C8.8 5.33645 8.7184 5.63885 8.5552 5.91725C8.392 6.18605 8.1712 6.40205 7.8928 6.56525C7.624 6.72845 7.3264 6.81005 7 6.81005C6.6736 6.81005 6.3712 6.72845 6.0928 6.56525C5.824 6.40205 5.608 6.18605 5.4448 5.91725C5.2816 5.63885 5.2 5.33645 5.2 5.01005C5.2 4.68365 5.2816 4.38605 5.4448 4.11725C5.608 3.83885 5.824 3.61805 6.0928 3.45485C6.3712 3.29165 6.6736 3.21005 7 3.21005ZM7 0.502848C7.9792 0.502848 8.9152 0.694848 9.808 1.07885C10.672 1.46285 11.4304 1.99565 12.0832 2.67725C12.7456 3.35885 13.2496 4.13645 13.5952 5.01005C13.2496 5.88365 12.7456 6.66125 12.0832 7.34285C11.4304 8.02445 10.672 8.55245 9.808 8.92685C8.9152 9.31085 7.9792 9.50285 7 9.50285C6.0208 9.50285 5.0848 9.31085 4.192 8.92685C3.328 8.55245 2.5648 8.02445 1.9024 7.34285C1.2496 6.66125 0.7504 5.88365 0.4048 5.01005C0.7504 4.13645 1.2496 3.35885 1.9024 2.67725C2.5648 1.99565 3.328 1.46285 4.192 1.07885C5.0848 0.694848 6.0208 0.502848 7 0.502848ZM1.7152 5.01005C2.0416 5.67245 2.4736 6.25325 3.0112 6.75245C3.5488 7.25165 4.1584 7.63565 4.84 7.90445C5.5312 8.17325 6.2512 8.30765 7 8.30765C8.1328 8.30765 9.1744 8.01005 10.1248 7.41485C11.0752 6.81965 11.8 6.01805 12.2992 5.01005C11.8 4.00205 11.0752 3.20045 10.1248 2.60525C9.1744 2.01005 8.1328 1.71245 7 1.71245C6.2512 1.71245 5.5312 1.84685 4.84 2.11565C4.1584 2.38445 3.5488 2.76845 3.0112 3.26765C2.4736 3.76685 2.0416 4.34765 1.7152 5.01005Z'
-                    fill='rgba(var(--center-channel-color-rgb), 0.72)'
+                    fill='rgba(var(--center-channel-color-rgb), 0.75)'
                     fillOpacity='0.48'
                 />
             </svg>
diff --git a/webapp/channels/src/components/widgets/inputs/channels_input.scss b/webapp/channels/src/components/widgets/inputs/channels_input.scss
index 799795b266..891519982b 100644
--- a/webapp/channels/src/components/widgets/inputs/channels_input.scss
+++ b/webapp/channels/src/components/widgets/inputs/channels_input.scss
@@ -15,7 +15,7 @@
         border-color: rgba(var(--center-channel-color-rgb), 0.2);
         background: var(--center-channel-bg);
         box-shadow: none;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         transition: none;
 
         &:hover {
@@ -57,7 +57,7 @@
 
     .channels-input__placeholder {
         margin-left: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
     }
 
     .channels-input__input {
@@ -102,7 +102,7 @@
         font-size: 16px;
 
         &--no-matches {
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             text-align: center;
 
             span {
@@ -142,7 +142,7 @@
             svg {
                 width: 18px;
                 height: 18px;
-                fill: rgba(var(--center-channel-color-rgb), 0.56);
+                fill: rgba(var(--center-channel-color-rgb), 0.75);
             }
         }
 
@@ -193,7 +193,7 @@
             height: 24px;
             padding: 4px;
             margin-right: 4px;
-            background: rgba(var(--center-channel-color-rgb), 0.56);
+            background: rgba(var(--center-channel-color-rgb), 0.75);
             border-radius: 16px;
         }
 
@@ -236,8 +236,8 @@
         svg {
             width: 16px;
             height: 16px;
-            fill: rgba(var(--center-channel-color-rgb), 0.64);
-            opacity: 0.6;
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
+            opacity: 0.73;
 
             &:hover {
                 fill: rgba(var(--center-channel-color-rgb), 0.8);
diff --git a/webapp/channels/src/components/widgets/inputs/check/check.scss b/webapp/channels/src/components/widgets/inputs/check/check.scss
index 09545e6d68..bb729c65e3 100644
--- a/webapp/channels/src/components/widgets/inputs/check/check.scss
+++ b/webapp/channels/src/components/widgets/inputs/check/check.scss
@@ -9,7 +9,7 @@
 
     .text {
         margin-left: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-style: normal;
         font-weight: 400;
diff --git a/webapp/channels/src/components/widgets/inputs/input/input.scss b/webapp/channels/src/components/widgets/inputs/input/input.scss
index 1440114afc..07358cbd3a 100644
--- a/webapp/channels/src/components/widgets/inputs/input/input.scss
+++ b/webapp/channels/src/components/widgets/inputs/input/input.scss
@@ -35,7 +35,7 @@
         outline: 0;
 
         &::placeholder {
-            color: rgba(var(--center-channel-color-rgb), 0.64);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         &.Input__focus {
@@ -55,7 +55,7 @@
         align-items: center;
         padding: 0 16px;
         margin: 2px 0;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 14px;
         line-height: 20px;
 
@@ -119,7 +119,7 @@
     }
 
     .Input___info {
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
 
         > span.valid {
             margin-left: 7px;
@@ -184,7 +184,7 @@
         border: none;
         margin-left: 12px;
         background-color: var(--center-channel-bg);
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 10px;
         line-height: 14px;
         opacity: 0;
diff --git a/webapp/channels/src/components/widgets/inputs/password_input/password_input.scss b/webapp/channels/src/components/widgets/inputs/password_input/password_input.scss
index a930d20fac..8b9c90045f 100644
--- a/webapp/channels/src/components/widgets/inputs/password_input/password_input.scss
+++ b/webapp/channels/src/components/widgets/inputs/password_input/password_input.scss
@@ -6,7 +6,7 @@
         border: 0;
         margin: 3px;
         background-color: var(--center-channel-bg);
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         cursor: pointer;
         font-size: 18px;
         line-height: 18px;
diff --git a/webapp/channels/src/components/widgets/inputs/url_input/url_input.scss b/webapp/channels/src/components/widgets/inputs/url_input/url_input.scss
index e869196f40..747a3b931d 100644
--- a/webapp/channels/src/components/widgets/inputs/url_input/url_input.scss
+++ b/webapp/channels/src/components/widgets/inputs/url_input/url_input.scss
@@ -18,7 +18,7 @@
             max-width: 100%;
             flex: none;
             margin-right: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.64);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 12px;
             line-height: 17px;
             overflow-wrap: anywhere;
diff --git a/webapp/channels/src/components/widgets/inputs/users_emails_input.scss b/webapp/channels/src/components/widgets/inputs/users_emails_input.scss
index 893c7cf66d..e6220f76eb 100644
--- a/webapp/channels/src/components/widgets/inputs/users_emails_input.scss
+++ b/webapp/channels/src/components/widgets/inputs/users_emails_input.scss
@@ -44,7 +44,7 @@
         border-color: rgba(var(--center-channel-color-rgb), 0.2);
         background: var(--center-channel-bg);
         box-shadow: none;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         transition: none;
 
         &--is-focused,
@@ -85,7 +85,7 @@
 
     .users-emails-input__placeholder {
         margin-left: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
     }
 
     .users-emails-input__input {
@@ -130,7 +130,7 @@
         gap: 8px;
 
         &--no-matches {
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             text-align: center;
 
             span {
@@ -233,7 +233,7 @@
             height: 24px;
             padding: 3px;
             margin-right: 4px;
-            background: rgba(var(--center-channel-color-rgb), 0.56);
+            background: rgba(var(--center-channel-color-rgb), 0.75);
             border-radius: 16px;
 
             svg {
@@ -265,8 +265,8 @@
         svg {
             width: 16px;
             height: 16px;
-            fill: rgba(var(--center-channel-color-rgb), 0.64);
-            opacity: 0.6;
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
+            opacity: 0.73;
 
             &:hover {
                 fill: rgba(var(--center-channel-color-rgb), 0.8);
diff --git a/webapp/channels/src/components/widgets/menu/menu.scss b/webapp/channels/src/components/widgets/menu/menu.scss
index 3636ba3a73..b1567ffa3e 100644
--- a/webapp/channels/src/components/widgets/menu/menu.scss
+++ b/webapp/channels/src/components/widgets/menu/menu.scss
@@ -165,7 +165,7 @@
                 padding: 0 20px;
 
                 .icon {
-                    color: rgba(var(--center-channel-color-rgb), 0.56);
+                    color: rgba(var(--center-channel-color-rgb), 0.64);
                 }
             }
         }
diff --git a/webapp/channels/src/components/widgets/menu/menu_items/menu_item.scss b/webapp/channels/src/components/widgets/menu/menu_items/menu_item.scss
index 63ff4b941a..2f9f5b29f2 100644
--- a/webapp/channels/src/components/widgets/menu/menu_items/menu_item.scss
+++ b/webapp/channels/src/components/widgets/menu/menu_items/menu_item.scss
@@ -25,8 +25,8 @@
 
         .MenuItem__compass-icon {
             margin: 4px -6px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
-            fill: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
+            fill: rgba(var(--center-channel-color-rgb), 0.64);
         }
 
         .MenuItem__compass-icon-dangerous {
@@ -34,7 +34,7 @@
         }
 
         .MenuItem__opacity {
-            opacity: 0.56;
+            opacity: 0.73;
         }
 
         span.icon {
@@ -54,7 +54,7 @@
         }
 
         span.MenuItem__text-color {
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         span.MenuItem__help-text {
@@ -303,7 +303,7 @@
 
         &__usage-label {
             padding-left: 18px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 11px;
             font-weight: bold;
         }
@@ -351,7 +351,7 @@
 .SubMenu__icon-left {
     position: relative;
     top: 0;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     font-size: 19px;
 }
 
@@ -366,7 +366,7 @@
 
 .SubMenu__icon-right {
     padding-top: 3px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     float: right;
     font-size: 19px;
 }
diff --git a/webapp/channels/src/components/widgets/menu/menu_items/restricted_indicator.scss b/webapp/channels/src/components/widgets/menu/menu_items/restricted_indicator.scss
index c4d81ba33d..d84c0cdbe0 100644
--- a/webapp/channels/src/components/widgets/menu/menu_items/restricted_indicator.scss
+++ b/webapp/channels/src/components/widgets/menu/menu_items/restricted_indicator.scss
@@ -46,6 +46,6 @@ button {
         font-size: 11px;
         letter-spacing: 0.02em;
         line-height: 16px;
-        opacity: 0.56;
+        opacity: 0.73;
     }
 }
diff --git a/webapp/channels/src/components/widgets/modals/full_screen_modal.scss b/webapp/channels/src/components/widgets/modals/full_screen_modal.scss
index 30d1ab97ef..21ba04c22f 100644
--- a/webapp/channels/src/components/widgets/modals/full_screen_modal.scss
+++ b/webapp/channels/src/components/widgets/modals/full_screen_modal.scss
@@ -25,11 +25,11 @@
             height: 40px;
             padding: 4px;
             border-radius: 4px;
-            fill: rgba(var(--center-channel-color-rgb), 0.56);
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
 
             &:hover {
                 background: rgba(var(--center-channel-color-rgb), 0.08);
-                fill: rgba(var(--center-channel-color-rgb), 0.72);
+                fill: rgba(var(--center-channel-color-rgb), 0.75);
             }
 
             &:active {
diff --git a/webapp/channels/src/components/widgets/public-private-selector/public-private-selector.scss b/webapp/channels/src/components/widgets/public-private-selector/public-private-selector.scss
index 502cc02757..65019c31d1 100644
--- a/webapp/channels/src/components/widgets/public-private-selector/public-private-selector.scss
+++ b/webapp/channels/src/components/widgets/public-private-selector/public-private-selector.scss
@@ -81,7 +81,7 @@
 
             .public-private-selector-button-description {
                 overflow: hidden;
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 12px;
                 line-height: 16px;
                 text-overflow: ellipsis;
@@ -92,7 +92,7 @@
         .public-private-selector-button-icon {
             display: flex;
             flex: none;
-            fill: rgba(var(--center-channel-color-rgb), 0.56);
+            fill: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         .public-private-selector-button-icon-check {
diff --git a/webapp/channels/src/components/widgets/team_icon/team_icon.scss b/webapp/channels/src/components/widgets/team_icon/team_icon.scss
index 4f94244c6f..b727264ddd 100644
--- a/webapp/channels/src/components/widgets/team_icon/team_icon.scss
+++ b/webapp/channels/src/components/widgets/team_icon/team_icon.scss
@@ -96,7 +96,7 @@
     }
 
     &.withImage.active {
-        box-shadow: 0 0 0 3px rgba(var(--sidebar-text-active-border-rgb), 0.72);
+        box-shadow: 0 0 0 3px rgba(var(--sidebar-text-active-border-rgb), 0.75);
 
         .TeamIcon__image {
             box-shadow: inset 0 0 0 3px var(--sidebar-teambar-bg);
diff --git a/webapp/channels/src/components/widgets/users/avatar/avatar.scss b/webapp/channels/src/components/widgets/users/avatar/avatar.scss
index 8c04ca3e79..a2786a62fd 100644
--- a/webapp/channels/src/components/widgets/users/avatar/avatar.scss
+++ b/webapp/channels/src/components/widgets/users/avatar/avatar.scss
@@ -77,7 +77,7 @@
             align-items: center;
             justify-content: center;
             border-radius: 50%;
-            color: rgba(var(--center-channel-color-rgb), 0.64);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             content: attr(data-content);
         }
     }
diff --git a/webapp/channels/src/plugins/call_button/call_button.scss b/webapp/channels/src/plugins/call_button/call_button.scss
index 4a857c054b..191c46c2c4 100644
--- a/webapp/channels/src/plugins/call_button/call_button.scss
+++ b/webapp/channels/src/plugins/call_button/call_button.scss
@@ -43,7 +43,7 @@ button {
         }
 
         &.dropdown {
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             fill: currentColor;
         }
 
@@ -94,7 +94,7 @@ button {
 
             .call-button-dropdown-sublabel {
                 margin-top: 4px;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 12px;
                 line-height: 16px;
             }
diff --git a/webapp/channels/src/sass/base/_css_variables.scss b/webapp/channels/src/sass/base/_css_variables.scss
index 61f8f4d144..74492fc794 100644
--- a/webapp/channels/src/sass/base/_css_variables.scss
+++ b/webapp/channels/src/sass/base/_css_variables.scss
@@ -65,7 +65,7 @@
 
     // offline indicator color stays the same in all themes, that's why it is separated from the other variables
     // the color specified here is the new hard-coded color from the compass design system
-    --offline-indicator: rgba(175, 179, 192, 0.64);
+    --offline-indicator: rgba(175, 179, 192, 0.75);
 
     // Elevation values used for box shadows.
     // Defined as CSS variables so that both sass and JS can use them.
diff --git a/webapp/channels/src/sass/base/_typography.scss b/webapp/channels/src/sass/base/_typography.scss
index 2aea2cf802..4f5a204e6e 100644
--- a/webapp/channels/src/sass/base/_typography.scss
+++ b/webapp/channels/src/sass/base/_typography.scss
@@ -59,7 +59,7 @@ label {
 }
 
 .light {
-    opacity: 0.56;
+    opacity: 0.73;
 }
 
 .word-break--all {
diff --git a/webapp/channels/src/sass/components/_buttons.scss b/webapp/channels/src/sass/components/_buttons.scss
index e63a1c6725..4c2d921be3 100644
--- a/webapp/channels/src/sass/components/_buttons.scss
+++ b/webapp/channels/src/sass/components/_buttons.scss
@@ -51,11 +51,11 @@ button {
         width: 40px;
         padding: 0;
         background-color: transparent;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
 
         &:hover {
             background-color: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.8);
         }
 
         &:focus,
diff --git a/webapp/channels/src/sass/components/_channel-header__icon.scss b/webapp/channels/src/sass/components/_channel-header__icon.scss
index 5990ae8a07..c950c0ec86 100644
--- a/webapp/channels/src/sass/components/_channel-header__icon.scss
+++ b/webapp/channels/src/sass/components/_channel-header__icon.scss
@@ -11,15 +11,15 @@
     margin: 16px 0 0 4px;
     background: transparent;
     border-radius: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     cursor: pointer;
-    fill: rgba(var(--center-channel-color-rgb), 0.56);
+    fill: rgba(var(--center-channel-color-rgb), 0.64);
     text-align: center;
 
     &:hover {
         background: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.72);
-        fill: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.8);
+        fill: rgba(var(--center-channel-color-rgb), 0.8);
     }
 
     .icon {
diff --git a/webapp/channels/src/sass/components/_channel-switcher.scss b/webapp/channels/src/sass/components/_channel-switcher.scss
index 465c1b68f8..093f5acb67 100644
--- a/webapp/channels/src/sass/components/_channel-switcher.scss
+++ b/webapp/channels/src/sass/components/_channel-switcher.scss
@@ -130,15 +130,11 @@ body.app__body {
             .modal-header {
                 .close {
                     // This rule needs to be very specific to override the colour of the close button used for other modals
-                    color: rgba(var(--center-channel-color-rgb), 0.56);
+                    color: rgba(var(--center-channel-color-rgb), 0.64);
 
                     &:hover {
-                        background-color:
-                            rgba(
-                                var(--center-channel-color-rgb),
-                                0.08
-                            );
-                        color: rgba(var(--center-channel-color-rgb), 0.72);
+                        background-color: rgba(var(--center-channel-color-rgb), 0.08);
+                        color: rgba(var(--center-channel-color-rgb), 0.8);
                     }
 
                     &:active {
@@ -156,7 +152,7 @@ body:not(.app__body) {
     .channel-switcher,
     .channel-invite {
         .close {
-            color: rgba(var(--sys-center-channel-color-rgb), 0.56);
+            color: rgba(var(--sys-center-channel-color-rgb), 0.75);
 
             &:hover {
                 background-color:
@@ -164,7 +160,7 @@ body:not(.app__body) {
                         var(--sys-center-channel-color-rgb),
                         0.08
                     );
-                color: rgba(var(--sys-center-channel-color-rgb), 0.72);
+                color: rgba(var(--sys-center-channel-color-rgb), 0.75);
             }
 
             &:active {
diff --git a/webapp/channels/src/sass/components/_day-picker.scss b/webapp/channels/src/sass/components/_day-picker.scss
index ee1bf08ee9..b5a242b61a 100644
--- a/webapp/channels/src/sass/components/_day-picker.scss
+++ b/webapp/channels/src/sass/components/_day-picker.scss
@@ -43,7 +43,7 @@
         }
 
         .DayPicker-Day--disabled {
-            color: rgba(var(--center-channel-color-rgb), 0.56) !important;
+            color: rgba(var(--center-channel-color-rgb), 0.75) !important;
         }
 
         .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside):not(.DayPicker-Day--selected) {
diff --git a/webapp/channels/src/sass/components/_emoji-picker-tabs.scss b/webapp/channels/src/sass/components/_emoji-picker-tabs.scss
index dd2b5bf881..86e451d56e 100644
--- a/webapp/channels/src/sass/components/_emoji-picker-tabs.scss
+++ b/webapp/channels/src/sass/components/_emoji-picker-tabs.scss
@@ -10,15 +10,15 @@
 
             svg,
             div {
-                color: rgba(var(--center-channel-color-rgb), 0.56);
-                fill: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
+                fill: rgba(var(--center-channel-color-rgb), 0.64);
             }
 
             &:hover {
                 svg,
                 div {
-                    color: rgba(var(--center-channel-color-rgb), 0.72);
-                    fill: rgba(var(--center-channel-color-rgb), 0.72);
+                    color: rgba(var(--center-channel-color-rgb), 0.8);
+                    fill: rgba(var(--center-channel-color-rgb), 0.8);
                 }
             }
         }
diff --git a/webapp/channels/src/sass/components/_emoticons.scss b/webapp/channels/src/sass/components/_emoticons.scss
index cca4d66b08..52eb5f26ac 100644
--- a/webapp/channels/src/sass/components/_emoticons.scss
+++ b/webapp/channels/src/sass/components/_emoticons.scss
@@ -199,12 +199,12 @@
         align-items: center;
         justify-content: center;
         border-radius: 4px;
-        color: rgba(var(--center-channel-color-rgb), 0.48);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
         text-decoration: none;
 
         &:hover {
             background-color: rgba(var(--center-channel-color-rgb), 0.04);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.8);
         }
 
         &:active {
@@ -399,11 +399,11 @@
         border: none;
         background: none;
         border-radius: 4px;
-        color: rgba(v(center-channel-color-rgb), 0.56);
+        color: rgba(v(center-channel-color-rgb), 0.75);
 
         &:hover {
             background: rgba(v(center-channel-color-rgb), 0.08);
-            color: rgba(v(center-channel-color-rgb), 0.72);
+            color: rgba(v(center-channel-color-rgb), 0.75);
         }
 
         &:active,
diff --git a/webapp/channels/src/sass/components/_files.scss b/webapp/channels/src/sass/components/_files.scss
index 988baabb9b..1e47e2cf52 100644
--- a/webapp/channels/src/sass/components/_files.scss
+++ b/webapp/channels/src/sass/components/_files.scss
@@ -49,18 +49,18 @@
         align-items: center;
         justify-content: center;
         border-radius: 4px;
-        color: rgba(v(center-channel-color-rgb), 0.56);
+        color: rgba(v(center-channel-color-rgb), 0.75);
         font-size: 1.4rem;
         text-align: center;
         text-decoration: none;
 
         &:focus {
-            color: rgba(v(center-channel-color-rgb), 0.56);
+            color: rgba(v(center-channel-color-rgb), 0.75);
         }
 
         &:hover {
             background: rgba(v(center-channel-color-rgb), 0.08);
-            color: rgba(v(center-channel-color-rgb), 0.72);
+            color: rgba(v(center-channel-color-rgb), 0.75);
         }
 
         &:active {
@@ -163,7 +163,7 @@
             display: inline-block;
             overflow: hidden;
             margin: -4px 0 0 0;
-            color: rgba(v(center-channel-color-rgb), 0.72);
+            color: rgba(v(center-channel-color-rgb), 0.75);
             cursor: pointer;
             font-size: 12px;
             text-overflow: ellipsis;
@@ -196,7 +196,7 @@
 
             .fa {
                 font-size: 20px;
-                opacity: 0.6;
+                opacity: 0.73;
             }
         }
 
@@ -314,7 +314,7 @@
 }
 
 .post-image__archived-tooltip-description {
-    opacity: 0.56;
+    opacity: 0.73;
 }
 
 .post-image__columns {
@@ -470,9 +470,9 @@
     margin-left: 8px;
     background-color: var(--center-channel-bg);
     border-radius: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.72);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     cursor: pointer;
-    fill: rgba(var(--center-channel-color-rgb), 0.72);
+    fill: rgba(var(--center-channel-color-rgb), 0.64);
     text-decoration: none;
     transition: opacity 0.15s ease;
 
@@ -483,7 +483,7 @@
     &:hover {
         display: flex;
         background-color: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.8);
     }
 
     &:focus {
@@ -509,7 +509,7 @@
     .post-image__archived-filename {
         overflow: hidden;
         max-width: 165px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-weight: 600;
         outline: none;
         text-decoration: none;
@@ -520,7 +520,7 @@
 
     .post-image__archived-label {
         padding-left: 7px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 10px;
         font-weight: normal;
     }
@@ -552,7 +552,7 @@
                 word-break: break-word;
 
                 &--archived {
-                    color: rgba(var(--center-channel-color-rgb), 0.56);
+                    color: rgba(var(--center-channel-color-rgb), 0.75);
                 }
 
                 a {
@@ -564,7 +564,7 @@
                 display: inline-block;
                 overflow: hidden;
                 max-width: 134px;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 float: left;
                 text-overflow: ellipsis;
                 white-space: nowrap;
@@ -575,14 +575,14 @@
                 overflow: hidden;
                 max-width: 134px;
                 float: left;
-                opacity: 0.6;
+                opacity: 0.73;
                 text-overflow: ellipsis;
                 white-space: nowrap;
             }
 
             .post-image__size {
                 margin-left: 4px;
-                opacity: 0.6;
+                opacity: 0.73;
             }
         }
     }
@@ -607,17 +607,17 @@
             align-items: center;
             justify-content: center;
             border-radius: 4px;
-            color: rgba(v(center-channel-color-rgb), 0.56);
+            color: rgba(v(center-channel-color-rgb), 0.75);
             font-size: 1.6rem;
             text-decoration: none;
 
             &:focus {
-                color: rgba(v(center-channel-color-rgb), 0.56);
+                color: rgba(v(center-channel-color-rgb), 0.75);
             }
 
             &:hover {
                 background: rgba(v(center-channel-color-rgb), 0.08);
-                color: rgba(v(center-channel-color-rgb), 0.72);
+                color: rgba(v(center-channel-color-rgb), 0.75);
             }
 
             &:active {
@@ -665,7 +665,7 @@
     }
 
     .post-image__uploadingTxt {
-        color: rgba(v(center-channel-color-rgb), 0.56);
+        color: rgba(v(center-channel-color-rgb), 0.75);
     }
 }
 
@@ -745,7 +745,7 @@
     .fa {
         color: $white;
         font-size: 20px;
-        opacity: 0.6;
+        opacity: 0.73;
     }
 }
 
diff --git a/webapp/channels/src/sass/components/_forms.scss b/webapp/channels/src/sass/components/_forms.scss
index 440171eaf4..9ecb284b54 100644
--- a/webapp/channels/src/sass/components/_forms.scss
+++ b/webapp/channels/src/sass/components/_forms.scss
@@ -65,7 +65,7 @@
             font-size: 1.05em;
             font-style: italic;
             font-weight: normal;
-            opacity: 0.6;
+            opacity: 0.73;
         }
     }
 
@@ -185,7 +185,7 @@
         &::-moz-placeholder,
         &:-moz-placeholder {
             color: inherit !important;
-            opacity: 0.6;
+            opacity: 0.73;
         }
     }
 }
diff --git a/webapp/channels/src/sass/components/_groups.scss b/webapp/channels/src/sass/components/_groups.scss
index e87e6eb974..2dd716cd59 100644
--- a/webapp/channels/src/sass/components/_groups.scss
+++ b/webapp/channels/src/sass/components/_groups.scss
@@ -215,7 +215,7 @@
         width: 150px;
         height: 100%;
         align-items: center;
-        opacity: 0.65;
+        opacity: 0.75;
 
         &.adjusted {
             width: 120px;
diff --git a/webapp/channels/src/sass/components/_modal.scss b/webapp/channels/src/sass/components/_modal.scss
index c8ea0423e3..7d9e535558 100644
--- a/webapp/channels/src/sass/components/_modal.scss
+++ b/webapp/channels/src/sass/components/_modal.scss
@@ -91,7 +91,7 @@
                 margin-bottom: 0;
                 font-size: 0.85em;
                 font-weight: normal;
-                opacity: 0.55;
+                opacity: 0.75;
             }
         }
     }
@@ -183,7 +183,7 @@
         margin-bottom: 3px;
         font-size: 0.9em;
         font-weight: 600;
-        opacity: 0.5;
+        opacity: 0.75;
     }
 
     .info__value {
@@ -278,7 +278,7 @@
             width: 40px;
             height: 40px;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
             font-size: 30px;
             font-weight: 400;
             opacity: 1;
@@ -290,7 +290,7 @@
 
             &:hover {
                 background: rgba(var(--center-channel-color-rgb), 0.08);
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.8);
             }
 
             &:active {
@@ -771,7 +771,7 @@
             height: 16px;
             margin-top: 0;
             margin-left: 8px;
-            color: rgba(61, 60, 64, 0.72);
+            color: rgba(61, 60, 64, 0.75);
             font-size: 16px;
             line-height: 16px;
 
@@ -792,12 +792,12 @@
 
             .more-modal__name_sub {
                 font-weight: 500;
-                opacity: 0.5;
+                opacity: 0.75;
             }
 
             .more-modal__name_count {
                 font-weight: 400;
-                opacity: 0.6;
+                opacity: 0.75;
             }
 
             svg {
@@ -881,7 +881,7 @@
         }
 
         .more-modal__shared-actions {
-            color: rgba(61, 60, 64, 0.72);
+            color: rgba(61, 60, 64, 0.75);
 
             .shared-user-icon {
                 width: 16px;
@@ -921,7 +921,7 @@
         width: 32px;
         height: 32px;
         line-height: 32px;
-        opacity: 0.5;
+        opacity: 0.75;
         text-align: center;
     }
 
diff --git a/webapp/channels/src/sass/components/_multi-select.scss b/webapp/channels/src/sass/components/_multi-select.scss
index fa4ea585f0..2b909ea6da 100644
--- a/webapp/channels/src/sass/components/_multi-select.scss
+++ b/webapp/channels/src/sass/components/_multi-select.scss
@@ -35,7 +35,7 @@
 
     > div:not(.multi-select__note),
     > span {
-        opacity: 0.6;
+        opacity: 0.73;
     }
 }
 
diff --git a/webapp/channels/src/sass/components/_permissions.scss b/webapp/channels/src/sass/components/_permissions.scss
index 97ed962df9..06c205ab58 100644
--- a/webapp/channels/src/sass/components/_permissions.scss
+++ b/webapp/channels/src/sass/components/_permissions.scss
@@ -172,7 +172,7 @@
         width: 100%;
         height: 100%;
         align-items: center;
-        opacity: 0.65;
+        opacity: 0.75;
 
         span {
             display: inline-block;
@@ -340,7 +340,7 @@
             margin-bottom: 10px;
             background: rgba(0, 0, 0, 0.05);
             border-radius: 13px;
-            color: alpha-color($black, 0.6);
+            color: alpha-color($black, 0.75);
             font-size: 11px;
         }
     }
diff --git a/webapp/channels/src/sass/components/_popover.scss b/webapp/channels/src/sass/components/_popover.scss
index 615b0cf717..bc219d454c 100644
--- a/webapp/channels/src/sass/components/_popover.scss
+++ b/webapp/channels/src/sass/components/_popover.scss
@@ -59,7 +59,7 @@
                     width: 16px;
                     height: 16px;
                     margin-left: 8px;
-                    color: rgba(61, 60, 64, 0.72);
+                    color: rgba(61, 60, 64, 0.75);
                     font-size: 16px;
                     line-height: 20px;
 
@@ -293,13 +293,14 @@
     border: none;
     margin-left: auto;
     background: none;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     font-weight: 400;
     line-height: 18px;
 
     &:hover {
         background: rgba(var(--center-channel-color-rgb), 0.08);
         border-radius: 4px;
+        color: rgba(var(--center-channel-color-rgb), 0.8);
     }
 }
 
@@ -317,7 +318,7 @@
     justify-content: flex-start;
     padding: 0 0 0 2.4rem;
     margin: 1.2rem 0 0;
-    color: rgba(var(--center-channel-color-rgb), 0.6);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 12px;
     font-weight: 600;
     text-transform: uppercase;
diff --git a/webapp/channels/src/sass/components/_post-menu.scss b/webapp/channels/src/sass/components/_post-menu.scss
index e385eca791..0a1de5eb66 100644
--- a/webapp/channels/src/sass/components/_post-menu.scss
+++ b/webapp/channels/src/sass/components/_post-menu.scss
@@ -85,7 +85,7 @@
             }
 
             .search-item__jump {
-                color: rgba(v(center-channel-color-rgb), 0.56);
+                color: rgba(v(center-channel-color-rgb), 0.75);
 
                 &:hover {
                     color: v(link-color);
@@ -94,13 +94,13 @@
 
             .post-menu__item {
                 display: inline-flex;
-                color: rgba(v(center-channel-color-rgb), 0.56);
-                fill: rgba(v(center-channel-color-rgb), 0.56);
+                color: rgba(v(center-channel-color-rgb), 0.64);
+                fill: rgba(v(center-channel-color-rgb), 0.64);
 
                 &:hover {
                     background: rgba(v(center-channel-color-rgb), 0.08);
-                    color: rgba(v(center-channel-color-rgb), 0.72);
-                    fill: rgba(v(center-channel-color-rgb), 0.72);
+                    color: rgba(v(center-channel-color-rgb), 0.8);
+                    fill: rgba(v(center-channel-color-rgb), 0.8);
                 }
 
                 &:active,
diff --git a/webapp/channels/src/sass/components/_post-right.scss b/webapp/channels/src/sass/components/_post-right.scss
index 8ce2bd401d..f75dcd8bbd 100644
--- a/webapp/channels/src/sass/components/_post-right.scss
+++ b/webapp/channels/src/sass/components/_post-right.scss
@@ -95,7 +95,7 @@
                         float: none;
 
                         .post__time {
-                            opacity: 0.6;
+                            opacity: 0.73;
                         }
                     }
                 }
diff --git a/webapp/channels/src/sass/components/_post.scss b/webapp/channels/src/sass/components/_post.scss
index 249a58a234..6e1f969cca 100644
--- a/webapp/channels/src/sass/components/_post.scss
+++ b/webapp/channels/src/sass/components/_post.scss
@@ -141,7 +141,7 @@
 
     .overlay__indent {
         @include clearfix;
-        @include alpha-property(background-color, $black, 0.6);
+        @include alpha-property(background-color, $black, 0.75);
 
         position: relative;
         height: 100%;
@@ -466,13 +466,13 @@
         margin: 5px 0;
         background: transparent;
         border-radius: 4px;
-        color: rgba(v(center-channel-color-rgb), 0.56);
-        fill: rgba(v(center-channel-color-rgb), 0.56);
+        color: rgba(v(center-channel-color-rgb), 0.75);
+        fill: rgba(v(center-channel-color-rgb), 0.75);
 
         &:hover {
             background: rgba(v(center-channel-color-rgb), 0.08);
-            color: rgba(v(center-channel-color-rgb), 0.72);
-            fill: rgba(v(center-channel-color-rgb), 0.72);
+            color: rgba(v(center-channel-color-rgb), 0.75);
+            fill: rgba(v(center-channel-color-rgb), 0.75);
         }
 
         &:active,
@@ -512,7 +512,7 @@
     display: inline-flex;
     align-items: center;
     margin: 8px 0;
-    color: rgba(var(--center-channel-color-rgb), 0.64);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-family: "Open Sans", sans-serif;
     font-size: 12px;
     gap: 8px;
@@ -687,7 +687,7 @@
         }
 
         .post__body {
-            color: rgba(var(--center-channel-color-rgb), 0.6);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
     }
 
@@ -984,7 +984,7 @@
                     display: block;
                     margin-right: 5px;
                     float: left;
-                    opacity: 0.6;
+                    opacity: 0.73;
                 }
             }
 
@@ -1030,7 +1030,7 @@
 
     .post-edited__indicator {
         display: inline-block;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 11px;
         font-style: italic;
         -webkit-user-select: none; /* Chrome all / Safari all */
@@ -1164,7 +1164,7 @@
                     }
 
                     .post__time {
-                        opacity: 0.6;
+                        opacity: 0.73;
                     }
 
                     .post__img {
@@ -1326,7 +1326,7 @@
             width: 16px;
             height: 20px;
             margin: 0 0 0 4px;
-            color: rgba(61, 60, 64, 0.72);
+            color: rgba(61, 60, 64, 0.75);
             font-size: 16px;
             line-height: 20px;
 
@@ -1615,7 +1615,7 @@
     .post__visibility {
         padding: 4px;
         font-size: 0.9em;
-        opacity: 0.6;
+        opacity: 0.75;
     }
 
     // styles for utility buttons i.e download, and copy source link in image preview
@@ -1639,7 +1639,7 @@
             height: 28px;
             padding: 2px;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             text-align: center;
 
             &:hover {
@@ -1649,7 +1649,7 @@
 
             svg {
                 padding-top: 2px;
-                fill: rgba(var(--center-channel-color-rgb), 0.56);
+                fill: rgba(var(--center-channel-color-rgb), 0.75);
             }
 
             // handle 'copy successful' styles
@@ -1689,7 +1689,7 @@
 
         &:hover button.size-aware-image__copy_link,
         &:hover a.size-aware-image__download {
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
     }
     // styles for image container of large images.
@@ -1711,7 +1711,7 @@
     .post__time,
     .post-preview__time {
         font-size: 0.9em;
-        opacity: 0.6;
+        opacity: 0.73;
     }
 
     .post__permalink {
@@ -1926,7 +1926,7 @@
                 display: inline-block;
                 width: auto;
                 margin-right: 8px;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 12px;
                 line-height: 16px;
             }
@@ -2094,7 +2094,7 @@
     font-size: 11px;
     font-weight: 600;
     line-height: 16px;
-    opacity: 0.56;
+    opacity: 0.73;
 }
 
 .post-message__text > ul,
@@ -2191,16 +2191,16 @@
 
     .edit-post-history__icon__button {
         height: fit-content;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
 
         &:hover {
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             cursor: pointer;
         }
 
         &.restore-icon:hover {
             background-color: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
     }
 }
@@ -2315,23 +2315,23 @@
                 height: 12px;
                 margin-right: 4px;
                 background: inherit;
-                fill: rgba(var(--center-channel-color-rgb), 0.56);
+                fill: rgba(var(--center-channel-color-rgb), 0.64);
                 vertical-align: middle;
             }
 
             &-text {
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 12px;
                 font-weight: normal;
             }
 
             &:hover {
                 &-icon > svg {
-                    fill: rgba(var(--center-channel-color-rgb), 0.72);
+                    fill: rgba(var(--center-channel-color-rgb), 0.8);
                 }
 
                 &-text {
-                    color: rgba(var(--center-channel-color-rgb), 0.72);
+                    color: rgba(var(--center-channel-color-rgb), 0.8);
                 }
             }
 
diff --git a/webapp/channels/src/sass/components/_react-select.scss b/webapp/channels/src/sass/components/_react-select.scss
index 51d8558aa6..6a9b1561c4 100644
--- a/webapp/channels/src/sass/components/_react-select.scss
+++ b/webapp/channels/src/sass/components/_react-select.scss
@@ -36,15 +36,15 @@
         svg {
             width: 16px;
             height: 16px;
-            fill: rgba(var(--sys-center-channel-color-rgb), 0.64);
-            opacity: 0.6;
+            fill: rgba(var(--sys-center-channel-color-rgb), 0.75);
+            opacity: 0.73;
 
             &:hover {
                 fill: rgba(var(--sys-center-channel-color-rgb), 0.8);
             }
 
             .app__body & {
-                fill: rgba(var(--center-channel-color-rgb), 0.64);
+                fill: rgba(var(--center-channel-color-rgb), 0.75);
 
                 &:hover {
                     fill: rgba(var(--center-channel-color-rgb), 0.8);
diff --git a/webapp/channels/src/sass/components/_search.scss b/webapp/channels/src/sass/components/_search.scss
index 76d5159349..57749e6492 100644
--- a/webapp/channels/src/sass/components/_search.scss
+++ b/webapp/channels/src/sass/components/_search.scss
@@ -31,7 +31,7 @@
     display: flex;
     height: 100%;
     align-items: center;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     pointer-events: none;
 }
 
@@ -39,7 +39,7 @@
     position: absolute;
     top: 6px;
     left: 9px;
-    fill: rgba(var(--center-channel-color-rgb), 0.56);
+    fill: rgba(var(--center-channel-color-rgb), 0.64);
     pointer-events: none;
 
     svg {
@@ -62,13 +62,13 @@
     align-items: center;
     justify-content: center;
     margin: 0;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
     cursor: pointer;
     font-size: 16px;
     visibility: hidden;
 
     &:hover {
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.8);
     }
 
     &:active {
@@ -202,7 +202,7 @@
 
         .search__font-icon,
         .input-clear-x {
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
         }
 
         .searchTypeBadge {
@@ -223,7 +223,7 @@
     .search__font-icon,
     .input-clear-x {
         display: flex;
-        color: rgba(var(--global-header-text-rgb), 0.56);
+        color: rgba(var(--global-header-text-rgb), 0.64);
     }
 }
 
@@ -292,7 +292,7 @@
             overflow: hidden;
             flex-shrink: 1;
             font-weight: 600;
-            opacity: 0.72;
+            opacity: 0.73;
             text-overflow: ellipsis;
             white-space: nowrap;
         }
diff --git a/webapp/channels/src/sass/components/_select.scss b/webapp/channels/src/sass/components/_select.scss
index f6271d4632..5d602fe2ee 100644
--- a/webapp/channels/src/sass/components/_select.scss
+++ b/webapp/channels/src/sass/components/_select.scss
@@ -6,7 +6,7 @@
 
     &:hover {
         &::after {
-            opacity: 0.6;
+            opacity: 0.73;
         }
     }
 
diff --git a/webapp/channels/src/sass/components/_settings-modal.scss b/webapp/channels/src/sass/components/_settings-modal.scss
index 8f0c2fca3b..5c4a430ea4 100644
--- a/webapp/channels/src/sass/components/_settings-modal.scss
+++ b/webapp/channels/src/sass/components/_settings-modal.scss
@@ -27,10 +27,14 @@
                     color: rgba(var(--center-channel-color-rgb), 0.75);
                     font-weight: 600;
 
+                    i {
+                        color: rgba(var(--center-channel-color-rgb), 0.64);
+                    }
+
                     &:hover {
                         background-color: rgba(var(--center-channel-color-rgb), 0.04);
                         border-radius: 4px;
-                        color: rgba(var(--center-channel-color-rgb), 0.88);
+                        color: rgba(var(--center-channel-color-rgb), 0.8);
                     }
                 }
 
@@ -38,6 +42,10 @@
                     button {
                         background: rgba(var(--button-bg-rgb), 0.08);
                         color: v(button-bg);
+
+                        i {
+                            color: v(button-bg);
+                        }
                     }
                 }
             }
diff --git a/webapp/channels/src/sass/components/_single_image_view.scss b/webapp/channels/src/sass/components/_single_image_view.scss
index 173bf740ad..fa978d1f35 100644
--- a/webapp/channels/src/sass/components/_single_image_view.scss
+++ b/webapp/channels/src/sass/components/_single_image_view.scss
@@ -9,12 +9,12 @@
             // number of selectors to override the specificity in _files.scss
             .image-name,
             button.single-image-view__toggle {
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
             }
 
             &:hover .image-name,
             &:hover button.single-image-view__toggle {
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
             }
 
             button.single-image-view__toggle {
@@ -63,7 +63,7 @@
 
         &:hover .image-header--expanded button.single-image-view__toggle {
             display: block;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         .image-container {
diff --git a/webapp/channels/src/sass/components/_suggestion-list.scss b/webapp/channels/src/sass/components/_suggestion-list.scss
index 0eeb81328f..a4d9cbb80a 100644
--- a/webapp/channels/src/sass/components/_suggestion-list.scss
+++ b/webapp/channels/src/sass/components/_suggestion-list.scss
@@ -37,7 +37,7 @@
         width: 16px;
         height: 16px;
         margin-left: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
         font-size: 16px;
         line-height: 16px;
 
@@ -110,7 +110,7 @@
     font-weight: 600;
 
     span {
-        opacity: 0.56;
+        opacity: 0.73;
     }
 }
 
@@ -124,7 +124,7 @@
     margin: 2px 0 0;
     font-size: 12px;
     line-height: 1.2;
-    opacity: 0.56;
+    opacity: 0.75;
     white-space: break-spaces;
 }
 
@@ -146,7 +146,7 @@
     justify-content: flex-start;
     padding: 0 0 0 2.4rem;
     margin: 1.2rem 0 0 0;
-    color: rgba(var(--center-channel-color-rgb), 0.6);
+    color: rgba(var(--center-channel-color-rgb), 0.75);
     font-size: 1.2rem;
     font-weight: 600;
     text-transform: uppercase;
@@ -208,7 +208,7 @@
         display: flex;
         overflow: hidden;
         max-width: 89%;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         gap: 8px;
         text-overflow: ellipsis;
         white-space: nowrap;
@@ -220,7 +220,7 @@
 
             .suggestion-list__desc {
                 margin-left: 8px;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
             }
         }
 
@@ -276,7 +276,7 @@
         align-items: center;
         justify-content: center;
         fill: v(center-channel-color);
-        opacity: 0.56;
+        opacity: 0.73;
 
         &--standard {
             width: 2rem;
@@ -309,7 +309,7 @@
         width: 16px;
         height: 16px;
         margin-left: 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.64);
         font-size: 16px;
         line-height: 16px;
 
diff --git a/webapp/channels/src/sass/components/_team-channel-settings.scss b/webapp/channels/src/sass/components/_team-channel-settings.scss
index 48dc14e01b..c2defa4d17 100644
--- a/webapp/channels/src/sass/components/_team-channel-settings.scss
+++ b/webapp/channels/src/sass/components/_team-channel-settings.scss
@@ -84,7 +84,7 @@ span.greyed-out {
     max-width: 668px;
     font-size: 12px;
     line-height: 17px;
-    opacity: 0.6;
+    opacity: 0.73;
 }
 
 #teams,
diff --git a/webapp/channels/src/sass/components/_tooltip.scss b/webapp/channels/src/sass/components/_tooltip.scss
index a2e373d523..3116eb5ca1 100644
--- a/webapp/channels/src/sass/components/_tooltip.scss
+++ b/webapp/channels/src/sass/components/_tooltip.scss
@@ -47,7 +47,7 @@
     }
 
     .tooltip-help {
-        color: rgba(255, 255, 255, 0.64);
+        color: rgba(255, 255, 255, 0.75);
     }
 
     .tooltip-title {
diff --git a/webapp/channels/src/sass/layout/_headers.scss b/webapp/channels/src/sass/layout/_headers.scss
index 35743a6c69..b93f30908f 100644
--- a/webapp/channels/src/sass/layout/_headers.scss
+++ b/webapp/channels/src/sass/layout/_headers.scss
@@ -53,11 +53,18 @@
         color: var(--center-channel-color);
         float: left;
 
+        i {
+            position: relative;
+            top: -1px;
+            font-size: 18px;
+            opacity: 0.64;
+        }
+
         &:hover {
             background: rgba(v(center-channel-color-rgb), 0.08);
 
             i {
-                opacity: 0.72;
+                opacity: 0.8;
             }
         }
 
@@ -72,13 +79,6 @@
                 opacity: 1;
             }
         }
-
-        i {
-            position: relative;
-            top: -1px;
-            font-size: 18px;
-            opacity: 0.56;
-        }
     }
 
     .channel-header__mute {
@@ -95,7 +95,7 @@
             background: rgba(v(center-channel-color-rgb), 0.08);
 
             i {
-                opacity: 0.72;
+                opacity: 0.73;
             }
         }
 
@@ -115,7 +115,7 @@
             position: relative;
             top: -2px;
             font-size: 16px;
-            opacity: 0.56;
+            opacity: 0.75;
         }
     }
 
@@ -161,8 +161,8 @@
             width: 20px;
             height: 20px;
             margin-right: 8px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
-            fill: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
+            fill: rgba(var(--center-channel-color-rgb), 0.64);
             font-size: 1.6rem;
             text-align: center;
 
@@ -430,7 +430,7 @@
             opacity: 1;
 
             button {
-                color: rgba(var(--center-channel-color-rgb), 0.64);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
 
                 .edit-icon {
                     display: none;
@@ -438,7 +438,7 @@
 
                 &:focus,
                 &:hover {
-                    color: rgba(var(--center-channel-color-rgb), 0.72);
+                    color: rgba(var(--center-channel-color-rgb), 0.88);
                     text-decoration: none;
                 }
 
@@ -482,7 +482,7 @@
         line-height: 16px;
 
         span.last-active__text {
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         .custom-emoji__wrapper {
diff --git a/webapp/channels/src/sass/layout/_markdown.scss b/webapp/channels/src/sass/layout/_markdown.scss
index deca2bbc0e..4c9fe35d0b 100644
--- a/webapp/channels/src/sass/layout/_markdown.scss
+++ b/webapp/channels/src/sass/layout/_markdown.scss
@@ -301,7 +301,7 @@ h6.markdown__heading {
 
         &:hover {
             background-color: rgba(var(--center-channel-color-rgb), 0.08);
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         &:active {
@@ -315,7 +315,7 @@ h6.markdown__heading {
         >i {
             margin-top: 1px;
             margin-left: -2px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
             font-size: 18px;
         }
 
@@ -330,7 +330,7 @@ h6.markdown__heading {
         height: 28px;
         padding: 4px 8px;
         margin-left: 4px;
-        background-color: rgba(var(--center-channel-color-rgb), 0.56);
+        background-color: rgba(var(--center-channel-color-rgb), 0.75);
         border-radius: 4px;
         color: var(--center-channel-bg);
         user-select: none;
@@ -424,7 +424,7 @@ blockquote {
         font-size: 20px;
         font-style: normal;
         font-weight: normal;
-        opacity: 0.6;
+        opacity: 0.73;
         text-decoration: inherit;
     }
 }
diff --git a/webapp/channels/src/sass/layout/_navigation.scss b/webapp/channels/src/sass/layout/_navigation.scss
index b2dc8dd59a..f492f6d2d0 100644
--- a/webapp/channels/src/sass/layout/_navigation.scss
+++ b/webapp/channels/src/sass/layout/_navigation.scss
@@ -135,7 +135,7 @@
                 width: 30px;
                 padding: 0;
                 font-size: 15px;
-                opacity: 0.6;
+                opacity: 0.73;
             }
 
             .icon--white {
diff --git a/webapp/channels/src/sass/layout/_sidebar-left.scss b/webapp/channels/src/sass/layout/_sidebar-left.scss
index 2108bef6c5..03c6d8a419 100644
--- a/webapp/channels/src/sass/layout/_sidebar-left.scss
+++ b/webapp/channels/src/sass/layout/_sidebar-left.scss
@@ -199,7 +199,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
             display: flex;
             padding: 6px 0;
             margin-left: 15px;
-            color: rgba(var(--sidebar-text-rgb), 0.72);
+            color: rgba(var(--sidebar-text-rgb), 0.64);
             line-height: 20px;
             list-style: none;
 
@@ -243,7 +243,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
             min-width: 28px;
             height: 28px;
             border: 0;
-            color: rgba(var(--sidebar-text-rgb), 0.72);
+            color: rgba(var(--sidebar-text-rgb), 0.64);
             font-size: 18px;
             vertical-align: middle;
 
@@ -321,7 +321,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
         width: 28px;
         height: 28px;
         border-radius: 4px;
-        color: rgba(var(--sidebar-text-rgb), 0.6);
+        color: rgba(var(--sidebar-text-rgb), 0.64);
         font-size: 18px;
         font-weight: 400;
         line-height: 26px;
@@ -358,7 +358,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
             }
 
             i {
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
                 font-size: 16px;
                 line-height: 16px;
             }
@@ -416,7 +416,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
 
     .AddChannelDropdown_dropdownButton {
         background-color: rgba(var(--sidebar-text-rgb), 0.08);
-        color: rgba(var(--sidebar-text-rgb), 0.72);
+        color: rgba(var(--sidebar-text-rgb), 0.64);
     }
 
     .SidebarMenu {
@@ -436,13 +436,13 @@ $sidebarOpacityAnimationDuration: 0.15s;
             }
 
             i {
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
                 font-size: 16px;
                 line-height: 16px;
             }
 
             svg {
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
             }
         }
 
@@ -531,7 +531,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
             .selected {
                 width: 60%;
                 margin-top: 1px;
-                color: rgba(var(--center-channel-color-rgb), 0.56);
+                color: rgba(var(--center-channel-color-rgb), 0.75);
                 font-size: 12px;
                 text-align: right;
                 text-transform: none;
@@ -547,7 +547,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
         border: none;
         background: transparent;
         border-radius: 4px;
-        color: rgba(var(--sidebar-text-rgb), 0.6);
+        color: rgba(var(--sidebar-text-rgb), 0.64);
         font-size: 16px;
         line-height: 16px;
 
@@ -625,14 +625,14 @@ $sidebarOpacityAnimationDuration: 0.15s;
             opacity: 1;
 
             >i {
-                color: rgba(var(--sidebar-text-rgb), 0.6);
+                color: rgba(var(--sidebar-text-rgb), 0.64);
                 font-size: 18px;
                 line-height: 16px;
             }
 
             .SidebarCategory_newDropBox-label {
                 margin-left: 8px;
-                color: rgba(var(--sidebar-text-rgb), 0.72);
+                color: rgba(var(--sidebar-text-rgb), 0.64);
                 font-size: 12px;
                 line-height: 16px;
             }
@@ -714,7 +714,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
         border: none;
         background-color: var(--sidebar-bg);
         box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.33);
-        color: rgba(var(--sidebar-text-rgb), 0.6);
+        color: rgba(var(--sidebar-text-rgb), 0.64);
         font-family: 'Open Sans', sans-serif;
         text-align: left;
         text-overflow: ellipsis;
@@ -766,7 +766,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
             color: rgba(var(--center-channel-color-rgb), 0.9);
 
             i {
-                color: rgba(var(--center-channel-color-rgb), 0.72);
+                color: rgba(var(--center-channel-color-rgb), 0.64);
             }
         }
     }
@@ -828,7 +828,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
         border: none;
         background-color: transparent;
         box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.33);
-        color: rgba(var(--sidebar-text-rgb), 0.6);
+        color: rgba(var(--sidebar-text-rgb), 0.64);
         font-family: 'Open Sans', sans-serif;
         font-size: 12px;
         font-weight: 600;
@@ -929,12 +929,12 @@ $sidebarOpacityAnimationDuration: 0.15s;
 
     .SidebarChannelGroup .draggingOver {
         border-radius: 4px;
-        box-shadow: inset -1px 0 0 rgba(var(--sidebar-text-rgb), 0.6), inset 0 -1px 0 rgba(var(--sidebar-text-rgb), 0.6), inset 1px 0 0 rgba(var(--sidebar-text-rgb), 0.6), inset 0 1px 0 rgba(var(--sidebar-text-rgb), 0.6);
+        box-shadow: inset -1px 0 0 rgba(var(--sidebar-text-rgb), 0.64), inset 0 -1px 0 rgba(var(--sidebar-text-rgb), 0.64), inset 1px 0 0 rgba(var(--sidebar-text-rgb), 0.64), inset 0 1px 0 rgba(var(--sidebar-text-rgb), 0.64);
 
         .SidebarChannelGroupHeader {
             background-color: var(--sidebar-bg);
             border-radius: 4px 4px 0 0;
-            box-shadow: inset -1px 0 0 rgba(var(--sidebar-text-rgb), 0.6), inset 1px 0 0 rgba(var(--sidebar-text-rgb), 0.6), inset 0 1px 0 rgba(var(--sidebar-text-rgb), 0.6);
+            box-shadow: inset -1px 0 0 rgba(var(--sidebar-text-rgb), 0.64), inset 1px 0 0 rgba(var(--sidebar-text-rgb), 0.64), inset 0 1px 0 rgba(var(--sidebar-text-rgb), 0.64);
         }
     }
 
@@ -1048,7 +1048,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
         align-items: center;
 
         /* border: solid 2px transparent; */
-        color: rgba(var(--sidebar-text-rgb), 0.6);
+        color: rgba(var(--sidebar-text-rgb), 0.64);
         list-style-type: none;
         opacity: 1;
         transition-duration: $sidebarHeightTransitionDuration;
@@ -1185,7 +1185,7 @@ $sidebarOpacityAnimationDuration: 0.15s;
         border-top: 0;
         border-bottom: 0;
         margin-right: 0;
-        color: rgba(var(--sidebar-text-rgb), 0.72);
+        color: rgba(var(--sidebar-text-rgb), 0.64);
         font-size: 14px;
         text-decoration: none;
 
@@ -1252,20 +1252,20 @@ $sidebarOpacityAnimationDuration: 0.15s;
         }
 
         &.selected {
-            background: rgba(var(--sidebar-text-active-border-rgb), 0.56);
+            background: rgba(var(--sidebar-text-active-border-rgb), 0.64);
 
             &:hover {
-                background: rgba(var(--sidebar-text-active-border-rgb), 0.72);
+                background: rgba(var(--sidebar-text-active-border-rgb), 0.64);
             }
         }
     }
 
     .SidebarLink.selected {
-        background: rgba(var(--sidebar-text-active-border-rgb), 0.56);
+        background: rgba(var(--sidebar-text-active-border-rgb), 0.64);
         color: rgba(var(--sidebar-text-rgb), 1);
 
         &:hover {
-            background: rgba(var(--sidebar-text-active-border-rgb), 0.72);
+            background: rgba(var(--sidebar-text-active-border-rgb), 0.64);
         }
     }
 
diff --git a/webapp/channels/src/sass/layout/_sidebar-right.scss b/webapp/channels/src/sass/layout/_sidebar-right.scss
index d32e34a73c..6d824a733c 100644
--- a/webapp/channels/src/sass/layout/_sidebar-right.scss
+++ b/webapp/channels/src/sass/layout/_sidebar-right.scss
@@ -152,7 +152,7 @@
         padding: 0 8px;
         border-left: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
         margin: 0 0 0 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         cursor: pointer;
         font-family: "Open Sans", sans-serif;
         font-size: 12px;
@@ -165,7 +165,7 @@
             border-color: transparent;
             background: rgba(var(--center-channel-color-rgb), 0.08);
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.72);
+            color: rgba(var(--center-channel-color-rgb), 0.75);
         }
 
         &:active {
@@ -180,7 +180,7 @@
         padding: 0 8px;
         border-left: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
         margin: 0 0 0 8px;
-        color: rgba(var(--center-channel-color-rgb), 0.56);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-family: "Open Sans", sans-serif;
         font-size: 12px;
         font-weight: normal;
diff --git a/webapp/channels/src/sass/layout/_team-sidebar.scss b/webapp/channels/src/sass/layout/_team-sidebar.scss
index 0231727394..a78e817d4a 100644
--- a/webapp/channels/src/sass/layout/_team-sidebar.scss
+++ b/webapp/channels/src/sass/layout/_team-sidebar.scss
@@ -9,7 +9,7 @@
 
     .fa {
         color: var(--sidebar-header-text-color);
-        opacity: 0.6;
+        opacity: 0.73;
         transition: all 0.15s ease;
 
         &:hover {
diff --git a/webapp/channels/src/sass/layout/_webhooks.scss b/webapp/channels/src/sass/layout/_webhooks.scss
index 1f58fcbd2f..f541b53b56 100644
--- a/webapp/channels/src/sass/layout/_webhooks.scss
+++ b/webapp/channels/src/sass/layout/_webhooks.scss
@@ -283,7 +283,7 @@
         }
 
         .attachment__author-name {
-            opacity: 0.6;
+            opacity: 0.73;
         }
 
         .attachment__title {
diff --git a/webapp/channels/src/sass/responsive/_mobile.scss b/webapp/channels/src/sass/responsive/_mobile.scss
index 05147b8d97..9fdcf0f6ac 100644
--- a/webapp/channels/src/sass/responsive/_mobile.scss
+++ b/webapp/channels/src/sass/responsive/_mobile.scss
@@ -112,7 +112,7 @@
                         }
 
                         .SubMenu__icon-right {
-                            color: rgba(255, 255, 255, 0.56);
+                            color: rgba(255, 255, 255, 0.75);
                         }
                     }
 
diff --git a/webapp/channels/src/sass/responsive/_tablet.scss b/webapp/channels/src/sass/responsive/_tablet.scss
index de95c50dea..7e6e44daaa 100644
--- a/webapp/channels/src/sass/responsive/_tablet.scss
+++ b/webapp/channels/src/sass/responsive/_tablet.scss
@@ -225,7 +225,7 @@
                         }
 
                         .post__time {
-                            opacity: 0.6;
+                            opacity: 0.73;
                         }
                     }
                 }
diff --git a/webapp/channels/src/sass/routes/_about-modal.scss b/webapp/channels/src/sass/routes/_about-modal.scss
index f1a1483f3d..174ae6af99 100644
--- a/webapp/channels/src/sass/routes/_about-modal.scss
+++ b/webapp/channels/src/sass/routes/_about-modal.scss
@@ -60,7 +60,7 @@
 
         .about-modal__copyright {
             margin-top: 0.5em;
-            opacity: 0.6;
+            opacity: 0.73;
         }
 
         .about-modal__links {
@@ -77,7 +77,7 @@
         }
 
         .about-modal__subtitle {
-            opacity: 0.6;
+            opacity: 0.73;
         }
 
         .about-modal__hash {
diff --git a/webapp/channels/src/sass/routes/_admin-console.scss b/webapp/channels/src/sass/routes/_admin-console.scss
index 5a28b1175f..2274a87790 100644
--- a/webapp/channels/src/sass/routes/_admin-console.scss
+++ b/webapp/channels/src/sass/routes/_admin-console.scss
@@ -155,7 +155,7 @@
             border-color: #66afe9;
             box-shadow:
                 inset 0 1px 1px rgba(0, 0, 0, 0.075),
-                0 0 8px rgba(102, 175, 233, 0.6);
+                0 0 8px rgba(102, 175, 233, 0.75);
             outline: 0;
         }
 
@@ -600,7 +600,7 @@
             left: 21px;
             width: 16px;
             height: 16px;
-            fill: rgba(var(--sys-sidebar-text-rgb), 0.56);
+            fill: rgba(var(--sys-sidebar-text-rgb), 0.75);
             stroke: #999;
         }
 
@@ -752,7 +752,7 @@
         height: 16px;
         padding: 0 4px 0 4px;
         margin-left: 8px;
-        background-color: rgba(255, 255, 255, 0.64);
+        background-color: rgba(255, 255, 255, 0.75);
         border-radius: 4px;
         color: rgba(61, 60, 64, 1);
         font-size: 10px;
diff --git a/webapp/channels/src/sass/routes/_backstage.scss b/webapp/channels/src/sass/routes/_backstage.scss
index 6626e18421..b5af40ebf3 100644
--- a/webapp/channels/src/sass/routes/_backstage.scss
+++ b/webapp/channels/src/sass/routes/_backstage.scss
@@ -537,11 +537,11 @@
 
 .bot-list__disabled {
     .item-details {
-        color: rgba($black, 0.6);
+        color: rgba($black, 0.75);
     }
 
     .bot-list {
-        opacity: 0.6;
+        opacity: 0.73;
     }
 }
 
diff --git a/webapp/channels/src/sass/routes/_settings.scss b/webapp/channels/src/sass/routes/_settings.scss
index 07a4c631d6..3434eb7f74 100644
--- a/webapp/channels/src/sass/routes/_settings.scss
+++ b/webapp/channels/src/sass/routes/_settings.scss
@@ -488,7 +488,7 @@
         }
 
         .nav-pills > li button {
-            color: rgba(var(--sidebar-text-rgb), 0.6);
+            color: rgba(var(--sidebar-text-rgb), 0.75);
         }
     }
 
diff --git a/webapp/channels/src/sass/routes/_signup.scss b/webapp/channels/src/sass/routes/_signup.scss
index ee3f5558a2..82569d608c 100644
--- a/webapp/channels/src/sass/routes/_signup.scss
+++ b/webapp/channels/src/sass/routes/_signup.scss
@@ -119,7 +119,7 @@ body {
     }
 
     .form-control:focus {
-        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
+        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.75);
     }
 
     h1,
diff --git a/webapp/channels/src/sass/utils/_mixins.scss b/webapp/channels/src/sass/utils/_mixins.scss
index bb0f48e81d..7f318ced3c 100644
--- a/webapp/channels/src/sass/utils/_mixins.scss
+++ b/webapp/channels/src/sass/utils/_mixins.scss
@@ -270,7 +270,7 @@
     border: 0;
     background: none;
     border-radius: 4px;
-    color: rgba(var(--center-channel-color-rgb), 0.56);
+    color: rgba(var(--center-channel-color-rgb), 0.64);
 
     &:focus,
     &:focus-within {
@@ -283,7 +283,7 @@
     &:hover {
         border: 0;
         background: rgba(var(--center-channel-color-rgb), 0.08);
-        color: rgba(var(--center-channel-color-rgb), 0.72);
+        color: rgba(var(--center-channel-color-rgb), 0.8);
     }
 
     &:active {
diff --git a/webapp/channels/src/utils/utils.tsx b/webapp/channels/src/utils/utils.tsx
index dfadaa5b76..e9b8cf45b7 100644
--- a/webapp/channels/src/utils/utils.tsx
+++ b/webapp/channels/src/utils/utils.tsx
@@ -322,9 +322,9 @@ export function toRgbValues(hexStr: string): string {
 export function applyTheme(theme: Theme) {
     if (theme.centerChannelColor) {
         changeCss('.app__body .markdown__table tbody tr:nth-child(2n)', 'background:' + changeOpacity(theme.centerChannelColor, 0.07));
-        changeCss('.app__body .channel-header__info .header-dropdown__icon', 'color:' + changeOpacity(theme.centerChannelColor, 0.8));
-        changeCss('.app__body .channel-header .pinned-posts-button svg', 'fill:' + changeOpacity(theme.centerChannelColor, 0.6));
-        changeCss('.app__body .channel-header .channel-header_plugin-dropdown svg', 'fill:' + changeOpacity(theme.centerChannelColor, 0.6));
+        changeCss('.app__body .channel-header__info .header-dropdown__icon', 'color:' + changeOpacity(theme.centerChannelColor, 0.75));
+        changeCss('.app__body .channel-header .pinned-posts-button svg', 'fill:' + changeOpacity(theme.centerChannelColor, 0.75));
+        changeCss('.app__body .channel-header .channel-header_plugin-dropdown svg', 'fill:' + changeOpacity(theme.centerChannelColor, 0.75));
         changeCss('.app__body .file-preview, .app__body .post-image__details, .app__body .markdown__table th, .app__body .markdown__table td, .app__body .webhooks__container, .app__body .dropdown-menu', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
         changeCss('.emoji-picker .emoji-picker__header', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
         changeCss('.app__body .popover.bottom>.arrow', 'border-bottom-color:' + changeOpacity(theme.centerChannelColor, 0.25));
diff --git a/webapp/platform/components/src/footer_pagination/footer_pagination.scss b/webapp/platform/components/src/footer_pagination/footer_pagination.scss
index 6bf9942421..f6e6e30c03 100644
--- a/webapp/platform/components/src/footer_pagination/footer_pagination.scss
+++ b/webapp/platform/components/src/footer_pagination/footer_pagination.scss
@@ -14,7 +14,7 @@
         flex: 1;
         align-items: center;
         justify-content: flex-start;
-        color: rgba(var(--center-channel-color-rgb), 0.64);
+        color: rgba(var(--center-channel-color-rgb), 0.75);
         font-size: 12px;
         font-weight: 600;
         line-height: 16px;
diff --git a/webapp/platform/components/src/tour_tip/tour_tip.scss b/webapp/platform/components/src/tour_tip/tour_tip.scss
index 378ae208df..7450efd49d 100644
--- a/webapp/platform/components/src/tour_tip/tour_tip.scss
+++ b/webapp/platform/components/src/tour_tip/tour_tip.scss
@@ -167,11 +167,12 @@
             margin-left: 1.2rem;
             background: transparent;
             border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
+            color: rgba(var(--center-channel-color-rgb), 0.64);
             font-weight: 600;
 
             &:hover {
                 background: rgba(var(--center-channel-color-rgb), 0.08);
+                color: rgba(var(--center-channel-color-rgb), 0.8);
             }
 
             &.active {