diff --git a/frontend/src/ManageOrgConstants/ConstantFormStyle.scss b/frontend/src/ManageOrgConstants/ConstantFormStyle.scss
index 9f70e8615e..a627964da0 100644
--- a/frontend/src/ManageOrgConstants/ConstantFormStyle.scss
+++ b/frontend/src/ManageOrgConstants/ConstantFormStyle.scss
@@ -191,6 +191,8 @@
 .tab.active {
   border-radius: 0px;
   color: #3e63dd;
+  padding-bottom: 8px;
+  border-bottom: 2px solid #3e63dd;
 
   .workspace-constant-text {
     padding-bottom: 8px;
@@ -219,6 +221,9 @@
       font-size: 12px;
       color: var(--text-medium, #CFD3D8);
     }
+    .tab-count.active {
+      color: #3e63dd;
+    }
   }
 }
 .tab-count {
diff --git a/frontend/src/_components/OrgConstantsVariablesResolver/OrgConstantsVariablesPreviewBox.jsx b/frontend/src/_components/OrgConstantsVariablesResolver/OrgConstantsVariablesPreviewBox.jsx
index 8a8835a04a..b04b427b5e 100644
--- a/frontend/src/_components/OrgConstantsVariablesResolver/OrgConstantsVariablesPreviewBox.jsx
+++ b/frontend/src/_components/OrgConstantsVariablesResolver/OrgConstantsVariablesPreviewBox.jsx
@@ -7,14 +7,12 @@ import React from 'react';
 export const OrgConstantVariablesPreviewBox = ({ workspaceVariables, workspaceConstants, value, isFocused }) => {
   const getResolveValueType = (currentValue) => {
     if (!currentValue) return null;
-
-    if (currentValue.includes('constants')) {
-      return 'Workspace global constant';
-    }
-
     if (currentValue.includes('secrets')) {
       return 'Workspace secret constant';
     }
+    if (currentValue.includes('constants')) {
+      return 'Workspace global constant';
+    }
 
     if (currentValue.includes('client')) {
       return 'client workspace variable';
@@ -60,6 +58,7 @@ const ResolvedValue = ({ value, isFocused, state = {}, type }) => {
     [preview, error] = [value, `Undefined constants: ${invalidConstants}`];
   } else {
     [preview, error] = resolveReferences(value, state, null, {}, true, true);
+
     if (isSecret && !error) {
       preview = hiddenSecretText;
     }
@@ -119,9 +118,13 @@ const ResolvedValue = ({ value, isFocused, state = {}, type }) => {
           ref={heightRef}
           className={`dynamic-variable-preview px-1 py-1 ${isValidError ? 'bg-red-lt' : 'bg-green-lt'}`}
         >
-          <div className="alert-banner-type-text">
+          <div className="alert-banner-type-text" data-cy="variable-preview">
             <div className="d-flex my-1">
-              <div className="flex-grow-1" style={{ fontWeight: 800, textTransform: 'capitalize' }}>
+              <div
+                className="flex-grow-1"
+                style={{ fontWeight: 800, textTransform: 'capitalize' }}
+                data-cy="alert-banner-type-text"
+              >
                 {isValidError ? 'Error' : isConstant ? null : ` ${type} - ${previewType}`}
               </div>
             </div>